input搜索框默认search 点击消失方法

网页制作中 search中默认显示search文字 ，如何设置鼠标点击搜索框时，search文字消失 ？
方法一：

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

查看演示

方法二：提示文字根据焦点自动消失的输入框javascript

2的功能较1来说较全面，代码也稍复杂一点，功能包括：

鼠标点击输入框,输入框获得焦点时,提示文字自动消失
鼠标焦点离开输入框,提示文字根据情况显示
输入框html代码

<input id="searchKey" type="text" name="q" value="" tips="请输入关键字"/><br />

<script language="javascript" type="text/javascript"> window.onload = function(){ var o=document.getElementByIdx_x("searchKey"); o.setAttribute("valueCache",o.value); o.onblur = function(){ if(o.value=="") { o.valueCache=""; o.value=o.tips; } else o.valueCache=o.value; } o.onfocus = function(){ o.value=o.valueCache; //光标始终在文字最后 var e = event.srcElement; var r =e.createTextRange(); r.moveStart('character',e.value.length); r.collapse(true); r.select(); } o.onblur(); } <script>