Skip to content

Instantly share code, notes, and snippets.

@nhunzaker
Created March 5, 2012 15:35
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save nhunzaker/1978857 to your computer and use it in GitHub Desktop.
Save nhunzaker/1978857 to your computer and use it in GitHub Desktop.
Dead simple inline labels (or placeholder pseudo-polyfill) for jQuery
// Inline Labels
// -------------------------------------------------- //
$('input, textarea').each(function() {
var self = $(this),
label = $("label[for='" + self.attr("id") + "']").text();
// Replace initial values
if (!self.val().replace(/^\s+/g, "").length) {
self.val(label).addClass("placeholder");
}
self.on("focus", function() {
if (self.val() === label) {
self.val('').removeClass("placeholder");
}
});
self.on("blur", function() {
if (!self.val().replace(/^\s+/g, "")) {
self.val(label).addClass("placeholder");
}
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment