在密码文本区域中显示纯文本

我试图通过单击复选框在密码文本区域中显示纯文本。我有工作文本框的之一，但我想获得它与两个这方面的工作是代码，我到目前为止有：在密码文本区域中显示纯文本

<!DOCTYPE html> 
<html> 
<head> 

<script type="text/javascript" src="//code.jquery.com/jquery-1.10.1.js"></script> 

<title>None</title> 

<script type='text/javascript'>//<![CDATA[ 
$(function(){ 
//Place this plugin snippet into another file in your applicationb 
(function ($) { 
    $.toggleShowPassword = function (options) { 
     var settings = $.extend({ 
      field: "#password", 
      control: "#toggle_show_password", 
     }, options); 

     var control = $(settings.control); 
     var field = $(settings.field) 

     control.bind('click', function() { 
      if (control.is(':checked')) { 
       field.attr('type', 'text'); 
      } else { 
       field.attr('type', 'password'); 
      } 
     }) 
    }; 
}(jQuery)); 

//Here how to call above plugin from everywhere in your application document body 
$.toggleShowPassword({ 
    field: '#password1', 
    field: '#password2', 
    control: '#checkbox1' 
}); 
});//]]> 

</script> 

</head>  
<body> 

Password: <input type="password" id="password" value="a" /> 

Password 2: <input type="password" id="password2" value="a" /> 

<input id="checkbox1" type="checkbox" />Show password 

</body> 
</html>

来源

2016-04-04 Blnukem

Javascript对象不能有两个具有相同名称（字段和字段）的键。 – Hypaethral

看到这个fiddle

首先，如果你定义与多次的对象相同的属性名称将只分配给它的最后一个值。所以

$.toggleShowPassword({ 
    field: '#password1, #password2', 
    control: '#checkbox1' 
});

会解决它。

其次，你的第一个passwordbox的ID是“密码”，而不1.

来源

2016-04-04 20:38:40 Toonijn

谢谢Toonijn作品完美 – Blnukem

而不是覆盖field选项（定义两次），把两个输入的ID在它：

$.toggleShowPassword({ 
    field: '#password, #password2', 
    control: '#checkbox1' 
});

来源

2016-04-04 20:38:01 blex

你可以尝试添加类的输入字段像这样：

Password: <input type="password" class="togglepassfield" id="password" value="a" /> 
Password 2: <input type="password" class="togglepassfield" id="password2" value="a" />

，然后使用类名：

$.toggleShowPassword({ 
    field: '.togglepassfield', 
    control: '#checkbox1' 
});

来源

2016-04-04 20:47:12 AimqEz

在密码文本区域中显示纯文本

回答

相关问题