用單個複選框切換多個密碼輸入

好什麼我試圖做的是切換3個密碼輸入框與一個複選框...點擊複選框我想所有3密碼顯示在那裏輸入框。無論如何要適應這個？用單個複選框切換多個密碼輸入

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<!-- 
    Created using jsbin.com 
    Source can be edited via http://jsbin.com/opafo3/1/edit 
--> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<title>Sandbox</title> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
<style type="text/css" media="screen"> 
body { background-color: #000; font: 16px Helvetica, Arial; color: #fff; } 
</style> 

<style id="jsbin-css"> 

</style> 
</head> 
<body> 
    <p><input id="show" type="checkbox" /><label for="show">show password</label></p> 
    <p><input id="txtpassword" type="password" /></p> 
<script> 
$(function(){ 
    $("#show").click(function(){ 
    if($("#show:checked").length > 0){ 
     var pswd = $("#txtpassword").val(); 
     $("#txtpassword").attr("id","txtpassword2"); 
     $("#txtpassword2").after($("<input id='txtpassword' type='text'>")); 
     $("#txtpassword2").remove(); 
     $("#txtpassword").val(pswd); 
    } 
    else{ 
     var pswd = $("#txtpassword").val(); 
     $("#txtpassword").attr("id","txtpassword2"); 
     $("#txtpassword2").after($("<input id='txtpassword' type='password'>")); 
     $("#txtpassword2").remove(); 
     $("#txtpassword").val(pswd); 
    } 
    }); 
}) 
</script> 



</body> 
</html>

我已經嘗試了幾件事情，但我無處可去。

來源

2013-02-11 mrmason

我有同樣的問題，並寫了一個簡單的jQuery插件來處理它，並將其發佈到github。

在你的情況下，使用將類似於：

<input type="password" id="inputGroup1"> 
<input type="password" id="inputGroup2"> 
<label> 
    <input type="checkbox" class="input-mask" data-toggle='["inputGroup1", "inputGroup2"]'>Toggle Password 
</label> 
<script> 
$('.input-mask').passwordToggle(); 
</script>

來源

2013-03-01 21:43:05 cbaigorri

令人驚訝的是，你無法通過互聯網獲取。但是，這裏是使用Jquery 1.9.1的代碼。

<html> 
    <head> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       $("#show").bind("click",function(){ 
        $(".txtPassword").each(function(e){ 
         if($($(".txtPassword")[e]).attr("type")=="password"){ 
          $($(".txtPassword")[e]).attr("type","text"); 
         } 
         else if($($(".txtPassword")[e]).attr("type")=="text"){ 
          $($(".txtPassword")[e]).attr("type","password"); 
         } 
        }) 
       }) 

      }); 
     </script> 
    </head> 
    <body> 
     <p><input id="show" type="checkbox" /><label for="show">show password</label></p> 
     <p><input class="txtpassword" type="password" /></p> 
     <p><input class="txtpassword" type="password" /></p> 
     <p><input class="txtpassword" type="password" /></p> 
    </body> 
</html>

將id更改爲您的密碼的類。此代碼可以照顧所有類型的密碼/文本類型txtpassword的元素

來源

2013-02-11 17:29:30

用單個複選框切換多個密碼輸入

回答

相關問題