Skip to content

Commit

Permalink
Switched to namespaced events. Rewrote/optimized some other stuff too…
Browse files Browse the repository at this point in the history
…. Much ♥ to Sean Koole and temp01!
  • Loading branch information
mathiasbynens committed Oct 5, 2010
1 parent 73c318c commit bcd5ce4
Show file tree
Hide file tree
Showing 2 changed files with 75 additions and 74 deletions.
145 changes: 73 additions & 72 deletions jquery.placeholder.js
Original file line number Diff line number Diff line change
@@ -1,78 +1,79 @@
/*!
* HTML5 Placeholder jQuery Plugin v1.4
* HTML5 Placeholder jQuery Plugin v1.5
* @link http://github.com/mathiasbynens/Placeholder-jQuery-Plugin
* @author Mathias Bynens <http://mathiasbynens.be/>
*/
;(function($) {
$.fn.placeholder = function() {
// Quit if there’s support for HTML5 placeholder
if (this[0] && 'placeholder' in document.createElement('input')) {
// Allow chaining
return this;
}
function args($elem) {
// Get attributes string from outerHTML
var html = $('<div>').append($elem.clone()).html().replace(/<(\w+)\s+(.*)>/, '$2'),
attr,
attrs = {};
while ((attr = html.match(/\s*([\w-]+)=("[^"]*"|'[^']*'|\w+)/))) {
// Assign attribute to dictionary, but remove quotes first
attrs[attr[1]] = attr[2].replace(/^(["'])(.*?)\1$/, '$2');
html = html.replace(attr[0], '');
}
return attrs;
}
function onFocus() {
var $input = $(this);
if ($input.val() === $input.attr('placeholder') && $input.hasClass('placeholder')) {
if ($input.data('placeholder-password')) {
$input.next().show().focus().end().remove();
} else {
$input.val('').removeClass('placeholder');
}
}
}
// Made this a function, because we actually need it on two different occasions:
// 1) Once when the DOM is loaded;
// 2) Once every time the focusout() is triggered.
function setPlaceholder($elem) {
var $replacement;
if ($elem.val() === '' || $elem.val() === $elem.attr('placeholder')) {
if ($elem.is(':password')) {
try {
$replacement = $elem.clone().attr({ type: 'text' });
} catch(e) {
$replacement = $('<input>', $.extend(args($elem), { type: 'text' }));
}
$replacement.data('placeholder-password', true).focus(onFocus);
$elem.hide().before($replacement);
$elem = $replacement;
}
$elem.addClass('placeholder').val($elem.attr('placeholder'));
} else {
$elem.removeClass('placeholder');
}
}
// Look for forms with inputs and/or textareas with a placeholder attribute in them
$('form:has([placeholder])').submit(function() {
// Clear the placeholder values so they don’t get submitted
$('.placeholder', this).val('');
});
// Clear placeholder values upon page reload
$(window).unload(function() {
$('.placeholder').val('');
});
// Yes, .each() — in case .placeholder() is called on several elements, which is very likely, e.g. $('input').placeholder();
return this.each(function() {
var $input = $(this);
// Quit if the current element doesn’t have a placeholder attribute, or is not an input/textarea at all
if (!$input.attr('placeholder') || !$input.is(':input')) {
return;
}
setPlaceholder($input);
$input.focus(onFocus).blur(function() {
setPlaceholder($input);
});
});
};

function args($elem) {
// Get attributes string from outerHTML
var html = $('<div>').append($elem.clone()).html().replace(/<(\w+)\s+(.*)>/, '$2'),
attr,
attrs = {};
while ((attr = html.match(/\s*([\w\-]+)=("[^"]*"|'[^']*'|\w+)/))) {
// Assign attribute to dictionary, but remove quotes first
attrs[attr[1]] = attr[2].replace(/^(["'])(.*?)\1$/, '$2');
html = html.replace(attr[0], '');
}
return attrs;
}

function onFocus() {
var $input = $(this);
if ($input.val() === $input.attr('placeholder') && $input.hasClass('placeholder')) {
if ($input.data('placeholder-password')) {
$input.next().show().focus().end().remove();
} else {
$input.val('').removeClass('placeholder');
}
}
}

// Made this a function, because we actually need it on two different occasions:
// 1) Once when the DOM is loaded;
// 2) Once every time the focusout() is triggered.
function setPlaceholder(elem) {
var $replacement,
$elem = $(this);
if ($elem.val() === '' || $elem.val() === $elem.attr('placeholder')) {
if ($elem.is(':password')) {
try {
$replacement = $elem.clone().attr({ type: 'text' });
} catch(e) {
$replacement = $('<input>', $.extend(args($elem), { type: 'text' }));
}
$replacement.data('placeholder-password', true).bind('focus.placeholder', onFocus);
$elem.hide().before($replacement);
$elem = $replacement;
}
$elem.addClass('placeholder').val($elem.attr('placeholder'));
} else {
$elem.removeClass('placeholder');
}
}

// Look for forms
$('form').bind('submit.placeholder', function() {
// Clear the placeholder values so they don’t get submitted
$('.placeholder', this).val('');
});

// Clear placeholder values upon page reload
$(window).bind('unload.placeholder', function() {
$('.placeholder').val('');
});

if ('placeholder' in document.createElement('input')) {
$.fn.placeholder = function() {
return this;
};
} else {
$.fn.placeholder = function() {
return this.filter(':input[placeholder]').bind({
'focus.placeholder': onFocus,
'blur.placeholder': setPlaceholder
}).trigger('blur.placeholder').end();
};
}

})(jQuery);
4 changes: 2 additions & 2 deletions jquery.placeholder.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit bcd5ce4

Please sign in to comment.