Forum Moderators: open
<html>
<head>
<script language="javascript" type="text/javascript">
function clearPassword()
{
document.getElementById('sample').setAttribute('class', 'empty');
document.getElementById('sample').value = '';
} function restorePassword()
{
var given_text= document.getElementById('sample').value;
if (given_text='')
{
document.getElementById('sample').setAttribute('class', 'grayedOut');
document.getElementById('sample').value = 'Enter your email';
}
else
{
document.getElementById('sample').setAttribute('class', 'empty');
document.getElementById('sample').value = given_text;
}
}
</script>
</head>
<body>
<form >
<input id="sample" type="text" value="Enter your email" size="22" class="grayedOut" onfocus="javascript:clearPassword();" onblur="javascript:restorePassword();"/>
<input id="new" type="text"/>
</form>
</body>
</html>
also setAttribute('class', ... ) is problem with some browsers
function restorePassword() {
var el = document.getElementById('sample');
if (el.value === '') {
el.className = 'grayedOut';
el.value = 'Enter your email';
} else { el.className = 'empty'; } // is else required ?
}