2012-11-23 41 views
1

对于登录表单,我试图在没有任何标签的情况下构建它,并使用占位符文本,以便用户知道要输入的内容。Jquery占位符插件以文本形式显示密码

问:如何修改下面的代码,使密码仅显示可读的占位符文本。

http://jsfiddle.net/DwAUY/

注:我也是用的密码屏蔽插件所以这个作品像iPhone。完整的例子作为jsfiddle。

/** 
* @preserve jquery.outofplace.js 
* HTML5 placeholders for all browsers 
* Copyright (c) 2010 timmy willison 
* Dual licensed under the MIT and GPL licenses. 
* http://timmywillison.com/licence/ 
*/ 
$.fn.outOfPlace = function (opts) { 

    opts = $.extend({ 

     // Gives you control over the submit function if needed 
     // The default function removes the placeholder before 
     // submitting the form in case the field is not required client-side 
     submit: function() { 
      $(this).find('input, textarea').each(function() { 
       var $input = $(this); 
       if($input.val() === $input.data('placeholder')) { 
        $input.val(''); 
       } 
      }); 
      return true; 
     }, 

     // The placeholder class for setting 
     // placeholder styles in your own css 
     // e.g. input.place { color: #666666; } 
     // This creates a lot more flexibility for you and 
     // keeps the js lightweight 
     placeClass: 'place' 
    }, opts); 

    /** Checks for browser autofill */ 
    function check_autofill ($input) { 
     setTimeout(function() { 
      var v = $input.val(); 
      if (v === $input.data('placeholder')) { 
       $input.addClass(opts.placeClass); 
      } else { 
       $input.removeClass(opts.placeClass); 
      } 
     }, 300); 
    } 

    return this.each(function() { 
     var $input = $(this), 
      defaultText = $input.attr('placeholder') || ''; 

     // Set the placeholder data for future reference 
     $input.data('placeholder', defaultText); 

     // Attribute no longer needed 
     $input.removeAttr('placeholder'); 

     // Focus and blurs, notice the class added and removed 
     $input.focus(function() { 
      if ($input.val() === defaultText) { 
       $input.val('').removeClass(opts.placeClass); 
      } 
     }).blur(function() { 
      if ($.trim($input.val()) === '') { 
       $input.val(defaultText).addClass(opts.placeClass); 
      } 
     }).blur() 
     // Bind the submit function 
     .closest('form').submit(opts.submit); 

     check_autofill($input); 
    }); 
}; 

回答

1

替换此位:

$('input:password').password123({ 
    character: "●" 
}); 

有了这个:

$('input:password')[0].type="text"; 

http://jsfiddle.net/DwAUY/2/

+0

不,那只是要删除密码屏蔽插件,甚至不能与解决问题标准密码显示为***** –

+0

@JohnMagnolia将其替换为:'$('input:passw ORD')[0] .TYPE = “文本”;' –

相关问题