表单文本框提示字符点击时清空

表单文本框提示字符点击时清空(input标签onfocus时文本框内提示信息清空)  

做用是,一个文本框,须要输入内容,在没有输入的时候里面有一段提示内容,当点击这个文本框输入的时候,文本框内的内容自动消失。挺简单的一个功能,可是没有想到实现起来仍是很麻烦的,在网上找了一段代码,贴上来以备后用。函数

给文本框添加触发事件onfocus和onblur,调用函数处理。完整代码:this

<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()">spa

  注意:本例的方法对大部分表单控件都有效,好比多行文本框。对象

  特别提示:运行完整代码,在鼠标第一次单击文本框时该文本框内容将被清空,在文本框外单击时文本框内容将还原回默认值。若是改变了文本框的值,将再也不有任何变化。blog

============================================================================================事件

ip

<input type="text"
                 id="text"
                 name="text"
                 value="默认显示文字"
                 onfocus="if(value == defaultValue){value='';this.style.color='#000'}"
                 onblur="if(!value){value = defaultValue;this.style.color='#999'}"

                 style="width:200px;color:#999999" />input

相关文章
相关标签/搜索