CODEWITHSUNDEEP
javascript
swathi yellanki
swathi yellanki

Reputation: 59

JavaScript Events like onclick and onload

How to display the below using javascript 1.Display password in text form and after displaying when we click on reset button it should be asteriked 2.when we click on password textbox it should be blank

Upvotes: 0

Views: 706

Answers (2)

OdinX
OdinX

Reputation: 4211

I think this should do it:

<html>
    <body>
        Password Box: <input type="text" onBlur="this.type='password'" onFocus="this.value=''; this.type='text'" />
    </body>
</html>​

Demo at http://jsfiddle.net/8jbPd/3/

Upvotes: 3

Misam
Misam

Reputation: 4389

Anwser to your 2nd Qs :

$('#password').bind('focusin', function(){
        if($(this).text() == 'Password')
        {       
            $(this).text('');
        }   
    });

    $('#password').bind('focusout',function(){      
        if($(this).text() == '')
        {
            $(this).text('password');
        }   
    })

Answer to your 1st Qs (haven't tested though)

<html>

<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--

var Obj,PassWord,Star,Nu;

function Enter(){
Obj=document.getElementById('passw');
PassWord=Obj.value;
if (PassWord.length<8){
alert('Minimum of Eight Charactors');
return;
}
document.getElementById('mypassw').value=PassWord;
Star='*';
Nu=1;
Change();
}

function Change(){
Obj.value=Star+PassWord.substring(Nu,PassWord.length);
Star+='*';
Nu++;
if (Nu<PassWord.length){ setTimeout('Change()',500) }
else {
Obj.value=Star;
Obj.setAttribute('disabled','disabled');
Obj.style.backgroundColor='silver';
}
}

//-->
</script>
</head>

<body>
<input id="passw" size="10"><input type="hidden" id="mypassw" name="mypassw" size="10">
<input type="button" name="" value="Enter" onclick="Enter();" >
</body>

</html>

Upvotes: 0

Related Questions