EDM邮件营销_搜索引擎营销SEM_北京网站优化_阿里排名优化_张遂华博客

有时为了提高用户的体验度，在表单中我们一般都会设置默认值，当用户点击输入时自动清空默认值，而当用户不填写任何信息而点击表单控件的其他地方时又会自动恢复默认值，其实实现这种效果非常简单，只要加入下面的js代码即可实现。

<script>
function cls(){
//捕获触发事件的对象，并设置为以下语句的默认对象
with(event.srcElement)
    //如果当前值为默认值，则清空
if(value==defaultValue) value=""
}
function res(){
//捕获触发事件的对象，并设置为以下语句的默认对象
with(event.srcElement)
//如果当前值为空，则重置为默认值
if(value=="") value=defaultValue
}
</script>
<input value="填写您的昵称" onfocus="cls()" onblur="res()">
<input value="填写您的生日(1900-01-01)"
 onfocus="cls()" onblur="res()">

这里主要是利用了onfocus事件和onblur事件来触发设定的函数操作。其中onfocus是接受焦点时执行操作，而onblur是失去焦点时所要执行的操作。

如果您觉得文章不错，建议您收藏！