[JS]一个可以在鼠标点击是消除框内的文字

请问如何在javascript中编出一个可以在鼠标点击是消除框内的文字

例如：注册页面会显示 请输入用户名，然后鼠标点上去后就清空了。怎么编这样的程序？

<input type="text" name="yourname"   value="请输入用户名"  class="yourname"  
 id="yourname"  onfocus="if (value =='请输入用户名'){value =''}" 
onblur="if (value ==''){value='请输入用户名'}"/>