diff --git a/README.md b/README.md
index d3341ea..5cad572 100644
--- a/README.md
+++ b/README.md
@@ -14,6 +14,7 @@ This plugin was based on a code snippet by [Paul Irish](http://paulirish.com/),
+
@@ -30,8 +31,8 @@ The plugin automatically adds `class="placeholder"` to the elements who are curr
## Notes
+* Works in all A-grade browsers, including IE6.
* The plugin automatically checks if the browser supports the HTML5 placeholder attribute for inputs natively. If this is the case, the plugin won’t do anything.
-* The plugin will ignore password inputs.
## Credits
diff --git a/jquery.placeholder.js b/jquery.placeholder.js
index 2e46d05..fd8793c 100644
--- a/jquery.placeholder.js
+++ b/jquery.placeholder.js
@@ -1,5 +1,5 @@
/*!
- * HTML5 Placeholder jQuery Plugin v1.2
+ * HTML5 Placeholder jQuery Plugin v1.3
* @link http://github.com/mathiasbynens/Placeholder-jQuery-Plugin
* @author Mathias Bynens
*/
@@ -9,17 +9,50 @@
if (this[0] && 'placeholder' in document.createElement('input')) {
// Allow chaining
return this;
- };
+ }
+ function args($elem) {
+ // Get attributes string from outerHTML
+ var html = $('
').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 = $('', $.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
@@ -32,16 +65,12 @@
// 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 is a password input, or not an input/textarea at all
- if ($input.is(':password') || !$input.is(':input')) {
+ // Quit if the current element is not an input/textarea at all
+ if (!$input.is(':input')) {
return;
- };
+ }
setPlaceholder($input);
- $input.focus(function() {
- if ($input.val() === $input.attr('placeholder')) {
- $input.val('').removeClass('placeholder');
- };
- }).blur(function() {
+ $input.focus(onFocus).blur(function() {
setPlaceholder($input);
});
});
diff --git a/jquery.placeholder.min.js b/jquery.placeholder.min.js
index 16b2e34..a77d3c0 100644
--- a/jquery.placeholder.min.js
+++ b/jquery.placeholder.min.js
@@ -1,6 +1,6 @@
/*!
- * HTML5 Placeholder jQuery Plugin v1.2
+ * HTML5 Placeholder jQuery Plugin v1.3
* @link http://github.com/mathiasbynens/Placeholder-jQuery-Plugin
* @author Mathias Bynens
*/
-(function(a){a.fn.placeholder=function(){if(this[0]&&'placeholder' in document.createElement('input')){return this}function b(c){if(c.val()===''||c.val()===c.attr('placeholder')){c.addClass('placeholder').val(c.attr('placeholder'))}else{c.removeClass('placeholder')}}a('form:has([placeholder])').submit(function(){a('.placeholder',this).val('')});a(window).unload(function(){a('.placeholder').val('')});return this.each(function(){var c=a(this);if(c.is(':password')||!c.is(':input')){return}b(c);c.focus(function(){if(c.val()===c.attr('placeholder')){c.val('').removeClass('placeholder')}}).blur(function(){b(c)})})}})(jQuery);
\ No newline at end of file
+(function(a){a.fn.placeholder=function(){if(this[0]&&'placeholder' in document.createElement('input')){return this}function b(f){var h=a('
').append(f.clone()).html().replace(/<(\w+)\s+(.*)>/,'$2'),e,g={};while((e=h.match(/\s*([\w-]+)=("[^"]*"|'[^']*'|\w+)/))){g[e[1]]=e[2].replace(/^(["'])(.*?)\1$/,'$2');h=h.replace(e[0],'')}return g}function c(){var e=a(this);if(e.val()===e.attr('placeholder')&&e.hasClass('placeholder')){if(e.data('placeholder-password')){e.next().show().focus().end().remove()}else{e.val('').removeClass('placeholder')}}}function d(f){var h;if(f.val()===''||f.val()===f.attr('placeholder')){if(f.is(':password')){try{h=f.clone().attr({type:'text'})}catch(g){h=a('',a.extend(b(f),{type:'text'}))}h.data('placeholder-password',true).focus(c);f.hide().before(h);f=h}f.addClass('placeholder').val(f.attr('placeholder'))}else{f.removeClass('placeholder')}}a('form:has([placeholder])').submit(function(){a('.placeholder',this).val('')});a(window).unload(function(){a('.placeholder').val('')});return this.each(function(){var e=a(this);if(!e.is(':input')){return}d(e);e.focus(c).blur(function(){d(e)})})}})(jQuery);
\ No newline at end of file