input 输入框获得/失去焦点时隐藏与显示文字
来源:自学PHP网
时间:2014-09-19 14:47 作者:
阅读:次
[导读] 一个基于jquery与js的input 输入框获得/失去焦点时隐藏与显示文字程序代码。有需要的朋友可参考参考。...
js中实现方法
代码如下 |
复制代码 |
<input type="text" value="不推荐这么做" onfocus="if(this.value == '不推荐这么做') this.value = ''" onblur="if(this.value == '') this.value = '不推荐这么做'" />
|
jquery方法
代码如下 |
复制代码 |
<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
var inputEl = $('#input_test'),
defVal = inputEl.val();
inputEl.bind({
focus: function() {
var _this = $(this);
if (_this.val() == defVal) {
_this.val('');
}
},
blur: function() {
var _this = $(this);
if (_this.val() == '') {
_this.val(defVal);
}
}
});
})
</script>
<title>input 输入框获得/失去焦点时隐藏/显示文字</title>
</head>
<body>
<input type="text" id="input_test" value="input 提示测试" />
</body>
</html>
|
|