Login box text

[ziycon]

I have two text boxes for a login page, they have a value in them as default, when a user clicks on one of the text boxes I want the default value to disappear and if the user doesn't enter anything and clicks away I want the default value to come back but if the user enters something then that value remains in the text box.

I was thinking that the onFocus and onBlur events would be the way to do it?

Anyone any tips on how to go about this?

[ziycon]

This is the code I'm using but when I click on the username box it removes the text and when I click away from it it will add in the default text but it empties the password box, any ideas?

<SCRIPT TYPE="text/javascript">
<!--
function clearField(input,cValue) {
	if(cValue == 'username' || cValue == 'password')
		cValue = '';

	if(input == 1 && cValue == '')
		document.login.user.value = "";
	if(input == 2 && cValue == '')
		document.login.pass.value = "";
}
function setField(input,nValue,cValue) {
	if(input == 1 && cValue == '')
		document.login.user.value = nValue;
	if(input == 2 && cValue == '')
		document.login.pass.value = nValue;
}
//-->
</SCRIPT>

<input type="text" name="user" size="25" value="username" class="loginBox" onclick="clearField(1,this.value);" onBlur="setField(1,'username',this.value);" />
<input type="password" name="pass" size="25" value="password" class="loginBox" onclick="clearField(2,this.value);" onBlur="setField(2,'password',this.value);" />

[acoder]

Hmm, I don't see that. Is the password text really necessary, because you can't see what it says anyway?