diff --git a/README.md b/README.md
index 3145845..0534d06 100644
--- a/README.md
+++ b/README.md
@@ -10,5 +10,18 @@ Extra attention has been paid to make sure that elements behave correctly when u
* Programmatically changing a placeholder element with .val('string') will remove the placeholder class
* With .placeholder({preventRefreshIssues:true}) a placeholder will be assigned autocomplete="off" to prevent browsers from filling an element with the placeholder text on refresh
+
+## Usage
+
+```javascript
+$(function(){
+ $('input[placeholder], textarea[placeholder]').placeholder();
+});
+```
+
+Easy.
+
+## Note
+
Initially forked from https://github.com/andrewrjones/jquery-placeholder-plugin/downloads
diff --git a/src/jquery.placeholder.js b/src/jquery.placeholder.js
index 41f718b..59ae413 100644
--- a/src/jquery.placeholder.js
+++ b/src/jquery.placeholder.js
@@ -1,116 +1,116 @@
(function($) {
- $.extend({
- placeholder : {
- settings : {
- focusClass: 'placeholderFocus',
- activeClass: 'placeholder',
- overrideSupport: false,
- preventRefreshIssues: true
- },
- debug : false,
- log : function(msg){
- if(!$.placeholder.debug) return;
- msg = "[Placeholder] " + msg;
- $.placeholder.hasFirebug ?
- console.log(msg) :
- $.placeholder.hasConsoleLog ?
- window.console.log(msg) :
- alert(msg);
- },
- hasFirebug : "console" in window && "firebug" in window.console,
- hasConsoleLog: "console" in window && "log" in window.console
- }
+ $.extend({
+ placeholder: {
+ settings: {
+ focusClass: 'placeholder-focus',
+ activeClass: 'placeholder',
+ passwordClass: 'placeholder-password',
+ overrideSupport: false,
+ preventRefreshIssues: true
+ },
+ debug: false,
+ log: function(msg) {
+ if (!$.placeholder.debug) return;
+ msg = "[Placeholder] " + msg;
+ $.placeholder.hasFirebug ? console.log(msg) : $.placeholder.hasConsoleLog ? window.console.log(msg) : alert(msg);
+ },
+ hasFirebug: "console" in window && "firebug" in window.console,
+ hasConsoleLog: "console" in window && "log" in window.console
+ }
- });
-
- // check browser support for placeholder
- $.support.placeholder = 'placeholder' in document.createElement('input');
-
- // Replace the val function to never return placeholders
- $.fn.plVal = $.fn.val;
- $.fn.val = function(value) {
- $.placeholder.log('in val');
- if(this[0]) {
- $.placeholder.log('have found an element');
- var el = $(this[0]);
- if(value != undefined)
- {
- $.placeholder.log('in setter');
- var currentValue = el.plVal();
- var returnValue = $(this).plVal(value);
- if(el.hasClass($.placeholder.settings.activeClass) && currentValue == el.attr('placeholder')){
- el.removeClass($.placeholder.settings.activeClass);
- }
- return returnValue;
- }
+ });
+
+ // check browser support for placeholder
+ $.support.placeholder = 'placeholder' in document.createElement('input');
+
+ // Replace the val function to never return placeholders
+ $.fn.plVal = $.fn.val;
+ $.fn.val = function(value) {
+ $.placeholder.log('in val');
+ if (this[0]) {
+ $.placeholder.log('have found an element');
+ var el = $(this[0]);
+ if (value != undefined) {
+ $.placeholder.log('in setter');
+ var currentValue = el.plVal();
+ var returnValue = $(this).plVal(value);
+ $.placeholder.log("Current: " + currentValue);
+ console.log(returnValue);
+ if (el.hasClass($.placeholder.settings.activeClass) && currentValue == el.attr('placeholder')) {
+ el.removeClass($.placeholder.settings.activeClass);
+ }
+ return returnValue;
+ }
+
+ if (el.hasClass($.placeholder.settings.activeClass) && el.plVal() == el.attr('placeholder')) {
+ $.placeholder.log('returning empty because it\'s a placeholder');
+ return '';
+ } else {
+ $.placeholder.log('returning original val');
+ return el.plVal();
+ }
+ }
+ $.placeholder.log('returning undefined');
+ return undefined;
+ };
+
+ // Clear placeholder values upon page reload
+ $(window).bind('beforeunload.placeholder', function() {
+ var els = $('input.' + $.placeholder.settings.activeClass);
+ if (els.length > 0) els.val('').attr('autocomplete', 'off');
+ });
+
+
+ // plugin code
+ $.fn.placeholder = function(opts) {
+ opts = $.extend({}, $.placeholder.settings, opts);
+
+ // we don't have to do anything if the browser supports placeholder
+ if (!opts.overrideSupport && $.support.placeholder) return this;
+
+ return this.each(function() {
+ var $el = $(this);
+
+ // skip if we do not have the placeholder attribute
+ if (!$el.is('[placeholder]')) return;
+
+ // Prevent values from being reapplied on refresh
+ if (opts.preventRefreshIssues) $el.attr('autocomplete', 'off');
+
+ $el.bind('focus.placeholder', function() {
+ var $el = $(this);
+ if (this.value == $el.attr('placeholder') && $el.hasClass(opts.activeClass)) $el.val('').removeClass(opts.activeClass).addClass(opts.focusClass);
+ if ($el.hasClass(opts.passwordClass)){
+ $el.removeClass(opts.passwordClass);
+ $el.get().type = 'password';
+
+ }
+ });
+ $el.bind('blur.placeholder', function() {
+ var $el = $(this);
+ $.placeholder.log("In blur")
+ $.placeholder.log('"' + this.value + '"')
+
+ $el.removeClass(opts.focusClass);
+
+ if (this.value == ''){
+ $.placeholder.log($el.attr('placeholder'))
+ $el.val($el.attr('placeholder')).addClass(opts.activeClass);
+ if ($el.is(':password')){
+ $el.addClass(opts.passwordClass);
+ $el.get().type = 'text';
- if(el.hasClass($.placeholder.settings.activeClass) && el.plVal() == el.attr('placeholder')) {
- $.placeholder.log('returning empty because it\'s a placeholder');
- return '';
- } else {
- $.placeholder.log('returning original val');
- return el.plVal();
}
}
- $.placeholder.log('returning undefined');
- return undefined;
- };
-
- // Clear placeholder values upon page reload
- $(window).bind('beforeunload.placeholder', function() {
- var els = $('input.' + $.placeholder.settings.activeClass);
- if(els.length > 0)
- els.val('').attr('autocomplete','off');
- });
-
-
- // plugin code
- $.fn.placeholder = function(opts) {
- opts = $.extend({},$.placeholder.settings, opts);
-
- // we don't have to do anything if the browser supports placeholder
- if(!opts.overrideSupport && $.support.placeholder)
- return this;
-
- return this.each(function() {
- var $el = $(this);
-
- // skip if we do not have the placeholder attribute
- if(!$el.is('[placeholder]'))
- return;
-
- // we cannot do password fields, but supported browsers can
- if($el.is(':password'))
- return;
-
- // Prevent values from being reapplied on refresh
- if(opts.preventRefreshIssues)
- $el.attr('autocomplete','off');
-
- $el.bind('focus.placeholder', function(){
- var $el = $(this);
- if(this.value == $el.attr('placeholder') && $el.hasClass(opts.activeClass))
- $el.val('')
- .removeClass(opts.activeClass)
- .addClass(opts.focusClass);
- });
- $el.bind('blur.placeholder', function(){
- var $el = $(this);
-
- $el.removeClass(opts.focusClass);
-
- if(this.value == '')
- $el.val($el.attr('placeholder'))
- .addClass(opts.activeClass);
- });
-
- $el.triggerHandler('blur');
-
- // Prevent incorrect form values being posted
- $el.parents('form').submit(function(){
- $el.triggerHandler('focus.placeholder');
- });
-
- });
- };
+ });
+
+ setTimeout(function(){ $el.triggerHandler('blur'); }, 100)
+
+ // Prevent incorrect form values being posted
+ $el.parents('form').submit(function() {
+ $el.triggerHandler('focus.placeholder');
+ });
+
+ });
+ };
})(jQuery);
diff --git a/tests/test.html b/tests/test.html
index 4c54310..ac913c4 100644
--- a/tests/test.html
+++ b/tests/test.html
@@ -6,7 +6,7 @@
Placeholder testing page
-
+