关于 文本框默认值 的操作js代码


Posted in Javascript onJanuary 12, 2012

比如:
搜索框:可以 <input value="搜索产品..." />
文本区域: 可以 <textarea>输入您多我的建议或者意见,让我们的网站为您创造更便捷的服务....</textarea>
........
首先说这种提示功能很好,非常直观,可是怎么让它们获取焦点时内容清空、失去焦点后内容分为空的话就显示提示文本.....
当页面这些元素多了之后如何去管理...等等问题

var inputText=function(o,e,e2){ 
if(!o)return;var txt=o.value; 
function inputTextChange(o,e,e2,txt){ 
o[e]=function(){var txt2=o.value;if(txt==txt2)o.value=""} 
o[e2]=function(){var txt2=o.value;if(txt2=="")o.value=txt} 
} 
new inputTextChange(o,e,e2,txt) 
}

上面我定义了一个函数
功能讲解:
参数 [o] : 需要操作的对象
参数 [e] : 需要清空对象值的事件
参数 [e2] : 需要返回默认值的事件
函数调用:
inputText(userName,"onmouseover","onmouseout");
函数应用示例:
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>input.value</title> 
</head><body> 
<script> 
var inputText=function(o,e,e2){if(!o)return;var txt=o.value; 
function inputTextChange(o,e,e2,txt){ 
o[e]=function(){var txt2=o.value;if(txt==txt2)o.value=""} 
o[e2]=function(){var txt2=o.value;if(txt2=="")o.value=txt}} 
new inputTextChange(o,e,e2,txt) 
} 
</script> 
<input type="text" value="请输入您的邮箱..." on /> 
<input type="text" value="请输入您的家庭住址..." /> 
<input type="text" value="请输入您的手机号..." /> 
<script> 
var inputArr=document.getElementsByTagName("input") 
for(var i in inputArr){ 
if(!inputArr[i].type=="text") continue; 
inputText(inputArr[i],"onfocus","onblur") 
} 
</script> 
</body></html>
Javascript 相关文章推荐
基于Jquery的文字滚动跑马灯插件(一个页面多个滚动区)
Jul 26 Javascript
javascript函数作用域学习示例(js作用域)
Jan 13 Javascript
node.js中的fs.appendFile方法使用说明
Dec 17 Javascript
Js使用WScript.Shell对象执行.bat文件和cmd命令
Dec 18 Javascript
创建、调用JavaScript对象的方法集锦
Dec 24 Javascript
在Node.js中使用HTTP上传文件的方法
Jun 23 Javascript
JavaScript 七大技巧(二)
Dec 13 Javascript
理解Javascript的call、apply
Dec 16 Javascript
js和jq使用submit方法无法提交表单的快速解决方法
May 17 Javascript
vue.js通过自定义指令实现数据拉取更新的实现方法
Oct 18 Javascript
JS如何生成一个不重复的ID的函数
Dec 25 Javascript
在vue项目中引入高德地图及其UI组件的方法
Sep 04 Javascript
新发现一个骗链接的方法(js读取cookies)
Jan 11 #Javascript
JS读取cookies信息(记录用户名)
Jan 10 #Javascript
判断对象是否Window的实现代码
Jan 10 #Javascript
jQuery在IE下使用未闭合的xml代码创建元素时的Bug介绍
Jan 10 #Javascript
javascript中onmouse事件在div中失效问题的解决方法
Jan 09 #Javascript
jQuery 阴影插件代码分享
Jan 09 #Javascript
jquery ajax 同步异步的执行 return值不能取得的解决方案
Jan 08 #Javascript
You might like
php接口和抽象类使用示例详解
2014/03/02 PHP
PHP获取一个字符串中间一部分字符的方法
2014/08/19 PHP
关于javascript 回调函数中变量作用域的讨论
2009/09/11 Javascript
jquery高效反选具体实现
2013/05/05 Javascript
jquery使整个div区域可以点击的方法
2015/06/24 Javascript
基于JavaScript实现鼠标悬浮弹出跟随鼠标移动的带箭头的信息层
2016/01/18 Javascript
移动端js图片查看器
2016/11/17 Javascript
微信小程序 页面跳转及数据传递详解
2017/03/14 Javascript
javascript作用域链与执行环境详解
2017/03/25 Javascript
es6学习笔记之Async函数基本教程
2017/05/11 Javascript
Require.JS中的几种define定义方式示例
2017/06/01 Javascript
React组件中的this的具体使用
2018/02/28 Javascript
vue-cli+webpack项目 修改项目名称的方法
2018/02/28 Javascript
vue二级菜单导航点击选中事件的方法
2018/09/12 Javascript
Vue中的v-for指令不起效果的解决方法
2018/09/27 Javascript
vue实现自定义日期组件功能的实例代码
2018/11/06 Javascript
JavaScript如何实现监听键盘输入和鼠标监点击
2020/07/20 Javascript
python中使用enumerate函数遍历元素实例
2014/06/16 Python
简单介绍Python下自己编写web框架的一些要点
2015/04/29 Python
浅谈pyhton学习中出现的各种问题(新手必看)
2017/05/17 Python
Django 后台带有字典的列表数据与页面js交互实例
2020/04/03 Python
Python with语句用法原理详解
2020/07/03 Python
技校生自我鉴定
2013/12/08 职场文书
面料业务员岗位职责
2013/12/26 职场文书
标准化管理实施方案
2014/02/25 职场文书
创先争优标语
2014/06/27 职场文书
学校门卫岗位职责范本
2014/06/30 职场文书
对外汉语专业大学生职业生涯规划书
2014/10/11 职场文书
硕士毕业论文导师评语
2014/12/31 职场文书
收费员岗位职责
2015/02/14 职场文书
上班旷工检讨书
2015/08/15 职场文书
Python中OpenCV实现简单车牌字符切割
2021/06/11 Python
SQL注入篇学习之盲注/宽字节注入
2022/03/03 MySQL
Linux系统下MySQL配置主从分离的步骤
2022/03/21 MySQL
Python+OpenCV实现图片中的圆形检测
2022/04/07 Python
MySQL索引失效场景及解决方案
2022/07/23 MySQL