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 相关文章推荐
js 获取中文拼音,Select自动匹配字母获取值的代码
Sep 23 Javascript
jquery实现滑动图片自己测试的例子
Nov 05 Javascript
JS常用字符串处理方法应用总结
May 22 Javascript
实例讲解JQuery中this和$(this)区别
Dec 08 Javascript
JavaScript返回网页中锚点数目的方法
Apr 03 Javascript
Bootstrap每天必学之模态框(Modal)插件
Apr 26 Javascript
前端框架Vue.js构建大型应用浅析
Sep 12 Javascript
微信小程序访问node.js接口服务器搭建教程
Apr 25 Javascript
JavaScript之面向对象_动力节点Java学院整理
Jun 29 Javascript
webpack学习笔记之代码分割和按需加载的实例详解
Jul 20 Javascript
利用jsonp与代理服务器方案解决跨域问题
Sep 14 Javascript
jQuery中复合选择器简单用法示例
Mar 31 jQuery
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 数组实例说明
2008/08/18 PHP
教你如何在CI框架中使用 .htaccess 隐藏url中index.php
2014/06/09 PHP
PHP Opcache安装和配置方法介绍
2015/05/28 PHP
extjs 为某个事件设置拦截器
2010/01/15 Javascript
Web前端设计模式  制作漂亮的弹出层
2010/10/29 Javascript
Javascript基础教程之变量
2015/01/18 Javascript
举例详解Python中smtplib模块处理电子邮件的使用
2015/06/24 Javascript
ArtEditor富文本编辑器增加表单提交功能
2016/04/18 Javascript
搭建Bootstrap离线文档的方法
2016/12/02 Javascript
利用jquery实现下拉框的禁用与启用
2016/12/07 Javascript
jQuery实现判断控件是否显示的方法
2017/01/11 Javascript
js实现文字选中分享功能
2017/01/25 Javascript
JS在浏览器中解析Base64编码图像
2017/02/09 Javascript
详解angularJS自定义指令间的相互交互
2017/07/05 Javascript
JavaScript函数中的this四种绑定形式
2017/08/15 Javascript
JavaScript中Require调用js的实例分享
2017/10/27 Javascript
详解基于vue的服务端渲染框架NUXT
2018/06/20 Javascript
Vue-CLI 3 scp2自动部署项目至服务器的方法
2020/07/24 Javascript
python optparse模块使用实例
2015/04/09 Python
Python实现基于多线程、多用户的FTP服务器与客户端功能完整实例
2017/08/18 Python
python实现简单点对点(p2p)聊天
2017/09/13 Python
python批量爬取下载抖音视频
2019/06/17 Python
python使用 zip 同时迭代多个序列示例
2019/07/06 Python
Python Django 简单分页的实现代码解析
2019/08/21 Python
利用Python制作动态排名图的实现代码
2020/04/09 Python
python中列表的含义及用法
2020/05/26 Python
Python调用jar包方法实现过程解析
2020/08/11 Python
python 提高开发效率的5个小技巧
2020/10/19 Python
详解canvas绘图时遇到的跨域问题
2018/03/22 HTML / CSS
戴尔美国官方折扣店:Dell Outlet
2018/02/13 全球购物
意大利巧克力店:Chocolate Shop
2019/07/24 全球购物
营销专业应届生求职信
2013/11/26 职场文书
小学秋季运动会报道稿
2014/09/30 职场文书
技术员岗位职责
2015/02/04 职场文书
总结高并发下Nginx性能如何优化
2021/11/01 Servers
MySQL数据库中varchar类型的数字比较大小的方法
2021/11/17 MySQL