300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 表单文本框提示字符点击时清空

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

时间:2022-02-05 06:51:28

相关推荐

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

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

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

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

<script>

function cls(){

//捕获触发事件的对象,并设置为以下语句的默认对象

with(event.srcElement)

//如果当前值为默认值,则清空

if(value==defaultValue) value=""

}

function res(){

//捕获触发事件的对象,并设置为以下语句的默认对象

with(event.srcElement)

//如果当前值为空,则重置为默认值

if(value=="") value=defaultValue

}

</script>

<input value="填写您的昵称" οnfοcus="cls()" οnblur="res()">

<input value="填写您的生日(1900-01-01)"

οnfοcus="cls()" οnblur="res()">

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

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

============================================================================================

<input type="text"

id="text"

name="text"

value="默认显示文字"

οnfοcus="if(value == defaultValue){value='';this.style.color='#000'}"

οnblur="if(!value){value = defaultValue;this.style.color='#999'}"

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

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。