jQuery设置和移除文本框默认值的方法


Posted in Javascript onMarch 09, 2015

本文实例讲述了jQuery设置和移除文本框默认值的方法。分享给大家供大家参考。具体分析如下:

开始时,文本框设定一个默认值。当光标移动到文本框时,如果文本框当前值是默认值,那么清空;离开文本框时,文本框值如果为空,那么将文本框值设置为默认值。

代码如下:

$(document).ready(function() {
  //each遍历文本框
  $(".input").each(function() {
    //保存当前文本框的值
    var vdefault = this.value;
    $(this).focus(function() {
      //获得焦点时,如果值为默认值,则设置为空
      if (this.value == vdefault) {
        this.value = "";
      }
    });
    $(this).blur(function() {
      //失去焦点时,如果值为空,则设置为默认值
      if (this.value == "") {
        this.value = vdefault;
      }
    });
  });
});

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
jquery 多行滚动代码(附详细解释)
Jun 17 Javascript
javascript setAttribute, getAttribute 在不同浏览器上的不同表现
Aug 05 Javascript
jQuery 在光标定位的地方插入文字的插件
May 10 Javascript
js实现图片放大缩小功能后进行复杂排序的方法
Nov 08 Javascript
jQuery 借助插件Lavalamp实现导航条动态美化效果
Sep 27 Javascript
PHPExcel中的一些常用方法汇总
Jan 23 Javascript
javascript实现炫酷的拖动分页
May 11 Javascript
Prototype框架详解
Nov 25 Javascript
微信小程序 教程之数据绑定
Oct 18 Javascript
微信小程序scroll-view实现横向滚动和上拉加载示例
Mar 06 Javascript
Js生成随机数/随机字符串的方法小结【5种方法】
May 27 Javascript
详解在IDEA中将Echarts引入web两种方式(使用js文件和maven的依赖导入)
Jul 11 Javascript
jQuery读取XML文件内容的方法
Mar 09 #Javascript
JQuery动态添加和删除表格行的方法
Mar 09 #Javascript
Python脚本后台运行的几种方式
Mar 09 #Javascript
JS控制表格实现一条光线流动分割行的方法
Mar 09 #Javascript
JS实现点击按钮自动增加一个单元格的方法
Mar 09 #Javascript
JS实现网页表格自动变大缩小的方法
Mar 09 #Javascript
EasyUI中datagrid在ie下reload失败解决方案
Mar 09 #Javascript
You might like
php报表之jpgraph柱状图实例代码
2011/08/22 PHP
PHP pthreads v3在centos7平台下的安装与配置操作方法
2020/02/21 PHP
PHP使用Http Post请求发送Json对象数据代码解析
2020/07/16 PHP
jQuery.get、jQuery.getJSON、jQuery.post无法返回JSON问题的解决方法
2011/07/28 Javascript
jQuery实现HTML5 placeholder效果实例
2014/12/09 Javascript
JavaScript中的call方法和apply方法使用对比
2015/08/12 Javascript
JavaScript中的时间处理小结
2016/02/24 Javascript
node网页分段渲染详解
2016/09/05 Javascript
详解jQuery lazyload 懒加载
2016/12/19 Javascript
JS前向后瞻正则表达式定义与用法示例
2016/12/27 Javascript
微信小程序 WebSocket详解及应用
2017/01/21 Javascript
Web纯前端“旭日图”实现元素周期表
2017/03/10 Javascript
vue+vuecli+webpack中使用mockjs模拟后端数据的示例
2017/10/24 Javascript
使用Bootstrap4 + Vue2实现分页查询的示例代码
2017/12/21 Javascript
vue-cli webpack 引入swiper的操作方法
2018/09/15 Javascript
微信小程序如何获取手机验证码
2018/11/04 Javascript
Vue实现将数据库中带html标签的内容输出(原始HTML(Raw HTML))
2019/10/28 Javascript
JavaScript中跨域问题的深入理解
2021/03/04 Javascript
python简单实现旋转图片的方法
2015/05/30 Python
Python神奇的内置函数locals的实例讲解
2019/02/22 Python
树莓派+摄像头实现对移动物体的检测
2019/06/22 Python
浅谈python多进程共享变量Value的使用tips
2019/07/16 Python
Python 函数用法简单示例【定义、参数、返回值、函数嵌套】
2019/09/20 Python
关于python pycharm中输出的内容不全的解决办法
2020/01/10 Python
python3实现网页版raspberry pi(树莓派)小车控制
2020/02/12 Python
阿巴庭院:Abba Patio
2019/06/18 全球购物
PHP开发的一般流程
2013/08/13 面试题
大学生求职简历的自我评价范文
2013/10/12 职场文书
大学生学习党课思想汇报
2014/01/03 职场文书
考试退步检讨书
2014/01/15 职场文书
教师学习培训邀请函
2014/02/04 职场文书
特教教师先进事迹
2014/05/21 职场文书
初中物理教学反思
2016/02/19 职场文书
解决Pytorch半精度浮点型网络训练的问题
2021/05/24 Python
入门学习Go的基本语法
2021/07/07 Golang
hive数据仓库新增字段方法
2022/06/25 数据库