700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > input文本框设置和移除默认值

input文本框设置和移除默认值

时间:2022-03-31 02:37:20

相关推荐

input文本框设置和移除默认值

input文本框设置和移除默认值

这里想实现的效果是:设置和移除文本框默认值,如下图鼠标放到文本框中的时候,灰字消失。

1.可以用简单的方式,就是给input文本框加上onfocus属性,如下代码:

[html]view plaincopy <inputid="keyword"name="keyword"size="10"class="inputstylekeywords"value="请输入关键字进行搜索"οnfοcus='if(this.value=="请输入关键字进行搜索"){this.value="";};'οnblur='if(this.value==""){this.value="请输入关键字进行搜索";};'>

其实onfocus属性挺好用的,还可以在通过onfocus属性改变css样式,如下代码:

[java]view plaincopy <inputid="keyword"name="keyword"size="10"class="inputstylekeywords"value="请输入关键字进行搜索"οnfοcus='if(this.value=="请输入关键字进行搜索"){this.value="";};this.className="input01"'οnblur='if(this.value==""){this.value="请输入关键字进行搜索";};this.className="input02"'>2.也可以使用jquery实现:[javascript]view plaincopy $(document).ready(function(){varvdefault=$('#keyword').val();$('#keyword').focus(function(){//获得焦点时,如果值为默认值,则设置为空if($(this).val()==vdefault){$(this).val("");}});$('#keyword').blur(function(){//失去焦点时,如果值为空,则设置为默认值if($(this).val()==""){$(this).val(vdefault);;}});});

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