₦airaland Forum

I just took on a lesson and came of with something nice. Let's see how you can achieve this little snippet.
QUESTION: Create an input password with toggling ability from asterisk to normal text... I will post mine immediately after the first comment.

hmm, lemme post mine then.

HTML MARKUP:

<html>
<head>
<title>Toggle Password Visibility</title>
</head>

<body>
<input type="password" placeholder="Insert Password" id="password">
<input type="button" value="Show Password..." id="button" onclick="visibility()">
</body>

</html>



JAVASCRIPT CODE:

function visibility(){

var type = $('#password').attr('type');

if(type == 'password'){
$('#password').attr('type', 'text');
$('#button').attr('value', 'Hide Password...');
}else if(type == 'text'){
$('#password').attr('type', 'password');
$('#button').attr('value', 'Show Password...');
}

}

I've not gone into JavaScript much but it may be done by toggling the 'type' attribute of the <input> element between 'password' and 'text'.

Craigston:
I've not gone into JavaScript much but it may be done by toggling the 'type' attribute of the <input> element between 'password' and 'text'.

This is just a simple jquery method