Home > Article > Web Front-end > 控制input输入框中提示信息的显示和隐藏的方法_javascript技巧

控制input输入框中提示信息的显示和隐藏的方法_javascript技巧

WBOYOriginal: 2016-05-16 17:00:212638browse

在运用html+css+javascrpt进行页面制作时，我们往往会遇到一些影响用户体验，而又容易被我们忽视的小细节。比如，input输入框中的提示信息，怎样才能根据对象获得和失去焦点而实现其显示和隐藏。今天在这里，想跟大家分享一下这个小技巧，希望各位大神不要拍砖哦~~~

一、要求

input输入框，在光标显示时，隐藏提示信息；光标离开输入框时，显示提示信息。

二、方法

1、给该input取id名，Onfocus=”方法名1(this)”，onblur=”方法名2(this)”

2、声明变量value，通过id名获得该input

3、function 方法名1(inputObj){

复制代码代码如下:

 
if(inputObj.value==”……”){ 

inputObj.value=””; 

} 

}

4、function 方法名2(inputObj){

复制代码代码如下:

 
if(inputObj.value==””){ 

inputObj.value=”……”; 

} 

}

5、注意：如果同一个页面中有多个input标签需要同样的设置，则方法名不能一致。

三、实例

复制代码代码如下:

无标题文档

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：jquery选择checked在ie8普通模式下的问题_jqueryNext article：raphael.js绘制中国地图地图绘制方法_javascript技巧

See more

控制input输入框中提示信息的显示和隐藏的方法_javascript技巧

Related articles