Eingabeart ändern, wenn das Kontrollkästchen aktiviert ist

Ich versuche, den Eingabe-Typ zu text von password zu ändern, wenn ich auf das Kontrollkästchen "Passwort anzeigen" klicke.Eingabeart ändern, wenn das Kontrollkästchen aktiviert ist

Das was ich geschrieben habe. Ist es richtig?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="password" class="password"/> 
 
<input type="password" class="password"/> 
 
<input type="checkbox" onchange="document.getElementsByClassName('password').type = this.checked ? 'text' : 'password'"> Show password

Quelle

2017-12-13 krish

$(function(){ 
 
    $("#check").on("change", function(){ 
 
     if($(this).prop('checked')){ 
 
      $(".password").attr("type", "text"); 
 
     } else { 
 
      $(".password").attr("type", "password"); 
 
     } 
 
    }) 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="password" class="password"/> 
 
<input type="password" class="password"/> 
 
<input type="checkbox" id='check'> Show password

Sie müssen nur id zum checkb bereitzustellen Ochs und dann auf Änderungsereignis, überprüft es für wenn Kontrollkästchen aktiviert ist oder nicht, wenn ja, dann wird es .password Klasse Feldeingabe macht sonst in Text es Passwort wird

Quelle

2017-12-13 07:45:48

function myFunction() { 
 
    var x = document.getElementById("myInput"); 
 
    if (x.type === "password") { 
 
     x.type = "text"; 
 
    } else { 
 
     x.type = "password"; 
 
    } 
 
}


 

 

 

 
Password: <input type="password" value="FakePSW" id="myInput"><br><br> 
 
<input type="checkbox" onclick="myFunction()">Show Password

Quelle

2017-12-13 07:44:02 RXD

Bitte erklären, was eigentlich Ihre Antwort tut. – Li357

<html> 
    <body> 
     <form name="myform"> 
      <input type="text" name="txt" /> 
      <input type="checkbox" name="option" value='1' onchange="changeType()" /> 
     </form> 
     <script> 
      function changeType() 
      { 
       document.myform.txt.type=(document.myform.option.value=(document.myform.option.value==1)?'-1':'1')=='1'?'text':'password'; 
      } 
     </script> 
    </body> 
</html>

Quelle

2017-12-13 07:46:58

In reinen Javascript Sie wie dies tun können, getElementsByClassName('password') wird Ihnen eine Sammlung von Knoten geben. Sie müssen es iterieren und die Änderungen auf jeden anwenden.

forEach() kann nicht auf Sammlung angewendet werden, daher wird Array.from(...) hier verwendet, um ein Array aus der Knotensammlung zu erstellen.

function doSomething(isChecked) { 
 
    var type = isChecked ? 'text' : 'password'; 
 
    Array.from(document.getElementsByClassName('password')).forEach(element => { 
 
    element.type = type; 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="password" class="password"/> 
 
<input type="password" class="password"/> 
 
<input type="checkbox" onchange="doSomething(this.checked)"> Show password

Quelle

2017-12-13 07:47:44

eine einzeilige Lösung, könnten Sie einen ternären Operator verwenden:

$("#check").on("change", function(){ 
 
    $(this).is(":checked") ? $(".password").attr("type", "text") : $(".password").attr("type", "password"); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="password" class="password" value="my"/> 
 
<input type="password" class="password" value="password?"/><br><br> 
 
<input type="checkbox" id='check'> Show password

Quelle

2017-12-13 07:52:03 SilverSurfer

Eingabeart ändern, wenn das Kontrollkästchen aktiviert ist

Antwort

Verwandte Themen