关于 文本框默认值 的操作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 相关文章推荐
cookie在javascript中的使用技巧以及隐私在服务器端的设置
Dec 03 Javascript
JavaScript 语言基础知识点总结(思维导图)
Nov 10 Javascript
JavaScript验证图片类型(扩展名)的函数分享
May 05 Javascript
html文档中的location对象属性理解及常见的用法
Aug 13 Javascript
jQuery性能优化技巧分析
Feb 20 Javascript
基于Echarts 3.19 制作常用的图形(非静态)
May 19 Javascript
浅谈Sublime Text 3运行JavaScript控制台
Jun 06 Javascript
Bootstrap学习笔记之环境配置(1)
Dec 07 Javascript
jQuery布局组件EasyUI Layout使用方法详解
Feb 28 Javascript
使用原生js+canvas实现模拟心电图的实例
Sep 20 Javascript
JS内部事件机制之单线程原理
Jul 02 Javascript
使用flow来规范javascript的变量类型
Sep 12 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
中东人咖啡哲学
2021/03/03 咖啡文化
桌面中心(二)数据库写入
2006/10/09 PHP
YII模块实现绑定二级域名的方法
2014/07/09 PHP
Adnroid 微信内置浏览器清除缓存
2016/07/11 PHP
Laravel5.1 框架表单验证操作实例详解
2020/01/07 PHP
JavaScript 函数惰性载入的实现及其优点介绍
2013/08/12 Javascript
页面载入结束自动调用js函数示例
2013/09/23 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
2015/02/13 Javascript
JS实现部分HTML固定页面顶部随屏滚动效果
2015/12/24 Javascript
javascript事件处理模型实例说明
2016/05/31 Javascript
纯js实现手风琴效果代码
2020/04/17 Javascript
浅谈js-FCC算法Friendly Date Ranges(详解)
2017/04/10 Javascript
微信小程序 侧滑删除(左滑删除)
2017/05/23 Javascript
egg.js的基本使用和调用数据库的方法示例
2019/05/18 Javascript
[54:25]Ti4 循环赛第三日LGD vs MOUZ
2014/07/12 DOTA
[48:23]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#1COL VS EG第一局
2016/03/05 DOTA
用smtplib和email封装python发送邮件模块类分享
2014/02/17 Python
Python中使用hashlib模块处理算法的教程
2015/04/28 Python
Python安装第三方库及常见问题处理方法汇总
2016/09/13 Python
Python单体模式的几种常见实现方法详解
2017/07/28 Python
python九九乘法表的实例
2017/09/26 Python
python 设置文件编码格式的实现方法
2017/12/21 Python
Django 实现购物车功能的示例代码
2018/10/08 Python
Python Opencv实现图像轮廓识别功能
2020/03/23 Python
python批量爬取下载抖音视频
2019/06/17 Python
基于python纯函数实现井字棋游戏
2020/05/27 Python
Pytorch 高效使用GPU的操作
2020/06/27 Python
Python实现快速大文件比较代码解析
2020/09/04 Python
Original Penguin美国官网:布拉德皮特、强尼德普喜爱的服装品牌
2016/10/25 全球购物
迷你唐卡软皮鞋:Minnetonka Moccasin
2018/05/01 全球购物
加大码胸罩、内裤和服装:Just My Size
2019/03/21 全球购物
shell程序如何生命变量?shell变量是弱变量吗?
2014/11/10 面试题
房地产活动策划方案
2014/05/14 职场文书
顶岗实习计划书
2015/01/16 职场文书
企业内部管理控制:银行存款控制制度范本
2020/01/10 职场文书
嵌入式Redis服务器在Spring Boot测试中的使用教程
2021/07/21 Redis