Textfield with default value disappearing on focus

If you want a default value disappering from your textfield e.g in a login- or search field you can add javascript to input tag. This is a customized login form to Drupal.

As you can see I changed the name on username field to xyz-name. In my case some script cleared username field, so I changed name and change it back on focus. Maybe there is some better way to do this.

<?php
<form id="user-login-form" method="post" accept-charset="UTF-8" action="frontpage?destination=frontpage">
<
div>
<
div id="edit-name-wrapper" class="form-item float-left">
<
input type="text" class="form-text required" size="9" maxlength="60" id="edit-name" name="xyz-name" onblur="this.value = this.value || this.defaultValue; this.style.color = '#999';" onfocus="this.value=''; this.name='name'; this.style.color = '#000';" value="username"/>
</
div>
<
div id="edit-pass-wrapper" class="form-item float-left"><input type="password" class="form-text required" size="9" maxlength="60" id="edit-pass" name="pass" onblur="this.value = this.value || this.defaultValue; this.style.color = '#999';" onfocus="this.value=''; this.style.color = '#000';" value="password"/></div>
<
input type="submit" class="form-submit" value="Log in" id="edit-submit" name="op"/>
<
div class="item-list">
<
ul>
<
li class="first"><a title="Create a new user account." href="/user/register">Apply here</a></li>
<
li class="last"><a title="Request new password via e-mail." href="/user/password">Request new password</a></li>
</
ul>
</
div>
<
input type="hidden" value="form-f08dc1f9cff61f6cca658b0eb15fd141" id="form-f08dc1f9cff61f6cca658b0eb15fd141" name="form_build_id"/>
<
input type="hidden" value="user_login_block" id="edit-user-login-block" name="form_id"/>
</
div>
</
form>
?>

Knowledge keywords: