easyui中propertygrid实现密码显示效果

实现一个密码显示效果（非明文显示）

效果如下图所示，输入密码后鼠标点击其他地方，显示圆点代替

实现代码如下：



js扩展代码

(function($){
    /**
     * datagrid扩展
     */
    $.extend($.fn.datagrid.defaults.editors, {
        password: {
            init: function(container, options){
                return $('<input type="password" class="datagrid-editable-input" />').appendTo(container);
            },
            destroy: function(target){
                $(target).remove();
            },
            getValue: function(target){
                return $(target).val();
            },
            setValue: function(target, value){
                $(target).val(value);
            },
            resize: function(target, width){
                $(target)._outerWidth(width);
            }
        }
    });
})(jQuery);

初始化

 columns = [[
    {field: 'name', title: '名称', width: 80, sortable: true},
    {field: 'value', title: '参数', width: 200, sortable: false, formatter:function(value, arr){
        var editor = '';
        if(typeof arr.editor == 'object'){
            editor = arr.editor.type;
        }else{
            editor = arr.editor;
        }
        switch(editor){
            case 'password':
                return value.replace(/./g, '●');
                break;
            default:
                return value;
        }
    }}
]];

原文链接：http://www.thinkphp.cn/code/1516.html