【My Study Load】JAVASCRIPT CODING
JavaScript Programming
JAVASCRIPT CODING
Add the “addEventListener” to the plural elements
<div>
<h5>Confirm Password</h5>
<input class="input four" type="password" name="password2" required
<?php if (isset($_SESSION['input-password'])) {
$input_password = $_SESSION['input-password']; ?>
value=<?php echo $input_password ?>
<?php } ?>
>
<i class="fa fa-eye password_open focus" id="hello" aria-hidden="true"></i>
<i class="fa fa-eye-slash password_closed" aria-hidden="true"></i>
</div>
<script>
const password_open = document.querySelectorAll(".password_open");
const password_closed = document.querySelectorAll(".password_closed");
password_open.forEach(password => password.addEventListener("click", ()=> {
password.classList.remove('focus');
password.parentNode.lastElementChild.classList.add("focus");
}));
password_closed.forEach(password => password.addEventListener("click", ()=> {
password.classList.remove('focus');
password.parentNode.children[2].classList.add("focus");
}));
</script>
Change the visibility of the password field
<!-- Password field -->
Password: <input type="password" value="FakePSW" id="myInput">
<!-- An element to toggle between password visibility -->
<input type="checkbox" onclick="myFunction()">Show Password
<script>
function myFunction() {
var x = document.getElementById("myInput");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}
</script>
JavaScript Programming