Skip to content

Instantly share code, notes, and snippets.

@coreyworrell
Created March 25, 2011 22:52
Show Gist options
  • Save coreyworrell/887800 to your computer and use it in GitHub Desktop.
Save coreyworrell/887800 to your computer and use it in GitHub Desktop.
Implements the input placeholder attribute for browsers that don't support it yet. Requires Modernizr.js
jQuery(function($) {
if ( ! Modernizr.input.placeholder) {
$(':input[placeholder]').each(function() {
var self = $(this);
var placeholder = self.attr('placeholder');
if ( ! self.val() || self.val() === placeholder) {
self.addClass('placeholder').val(placeholder);
}
self.focus(function() {
if (self.val() === placeholder) {
self.removeClass('placeholder').val('');
}
})
.blur(function() {
if ( ! self.val()) {
self.val(placeholder)
.addClass('placeholder');
}
if (self.val() === placeholder) {
self.addClass('placeholder');
}
});
});
// Clear placeholders on form submit
$('form').submit(function() {
$(':input[placeholder]').each(function() {
var self = $(this);
if (self.val() === self.attr('placeholder')) {
self.val('');
}
});
});
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment