javascript - Jquery 占位符插件将密码显示为文本

标签 javascript 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 );
    });
};  

最佳答案

替换该位:

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

这样:

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

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

关于javascript - Jquery 占位符插件将密码显示为文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13527158/

相关文章:

Javascript 尝试使用 string.replace() 和正则表达式作为列表值

javascript - JQuery 或 Javascript 获取窗口父元素

javascript - 如何防止固定 div 后面的内容滚动?

javascript - 将 div 标签的内容保存到图像文件中

javascript - 具有恒定比例且始终为屏幕高度的 100% 的 Div

jquery - 使用jquery增加和减小搜索框的大小

java - 访问导入的js文件中的Spring MVC模型数据

javascript - 使用单个文件容器配置多个放置区时,JQuery 文件上传插件出现问题

javascript - 在 Magento 中单击一次并进行验证后禁用“提交”按钮

javascript - jquery-ias 插件不适用于我的网站,加载更多项目不起作用