js中的焦点事件问题

在web页面中，经常要实现这样一个js功能：鼠标焦点落到输入框内，输入框原有默认值消失，当失去焦点时，如果用户未输入任何内容，怎还是显示默认值。

今天在修改一页面时，发现一个问题：在页面是可以实现上述功能，但提交表单后，由于在服务端数据校验不通过时（为测试服务端的校验功能，屏蔽了前端的js校验。），alert 弹提示框后，再history.back(-1);返回表单填写页时，表单中默认内容是用户输入的不合法的内容（到此处没问题），但是当鼠标焦点落到输入框内时，原有不合法的内容就消失了，用户得从头输入，用户体验不太好，查看了原js，是由一个函数完成的（此函数的没看太明白），如下：

$(function(){
$(":text").each(function(index,ele) {
var tip=$(ele).val();
$(this).focus(function(){
if($(this).val()==tip){
$(this).val('');
}
$(this).addClass('focus_text');
}).blur(function(){
if(!$(this).val()){
$(this).val(tip).removeClass('focus_text')
}
})
});
})

屏蔽了上述函数，对各input元素，添加了 Onblur（失去焦点）、onfocus（获得焦点）的事件响应。大概思路是：

blur时，检查元素的值是否等于''，如果是，就修改其值为默认值，如果不是就不做操作

focus时，检查元素的值是否等于默认值，如果是，就修改其值为''，如果不是就不做操作

具体代码如下：

1、html页面中（部分）

<p class="row"><label class="col1 big stress" for="phone">您的电话:</label><input class="text" id="phone" type="text" name="phone" value="为了方便联系，请您留下手机号" onkeydown="return test(event);" onfocus="return clean_default('phone');" onblur="return set_default('phone');"/></p>
<p class="row"><label class="col1 big stress" for="email">您的邮箱:</label><input class="text" id="email" type="text" name="email" value="为了方便联系，请您留下邮箱地址" onfocus="return clean_default('email');" onblur="return set_default('email');"/></p>

2、js

function clean_default(element_name)
{
if((element_name=='phone')&&($('#phone').val()=='为了方便联系，请您留下手机号')){
$('#phone').val('');
}

if((element_name=='email')&&($('#email').val()=='为了方便联系，请您留下邮箱地址')){
$('#email').val('');
}
return true;
}

function set_default(element_name){

if((element_name=='phone')&&($('#phone').val()=='')){
$('#phone').val('为了方便联系，请您留下手机号');
}

if((element_name=='email')&&($('#email').val()=='')){
$('#email').val('为了方便联系，请您留下邮箱地址');
}
return true;
}

这样就可以实现最开始的功能了，这样写有2个缺点：

1、input元素默认值内容修改时，js将失效

2、每添加一个input都需要添加相应的判断代码

---- 以后哪天找到更好的方法，再慢慢改进！