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 对象是否存在判断
Jul 15 Javascript
js获取当前地址 JS获取当前URL的示例代码
Feb 26 Javascript
js学习阶段总结(必看篇)
Jun 16 Javascript
JavaScript实现格式化字符串函数String.format
Dec 16 Javascript
jQuery实现简单弹窗遮罩效果
Feb 27 Javascript
vue快捷键与基础指令详解
Jun 01 Javascript
详解用vue编写弹出框组件
Jul 04 Javascript
vue.js element-ui validate中代码不执行问题解决方法
Dec 18 Javascript
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
May 13 Javascript
layui插件表单验证提交触发提交的例子
Sep 09 Javascript
功能完善的小程序日历组件的实现
Mar 31 Javascript
vue渲染方式render和template的区别
Jun 05 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实现粘贴截图并完成上传功能
2015/05/17 PHP
深入解析PHP中foreach语句控制数组循环的用法
2015/11/30 PHP
Document 对象的常用方法
2009/07/31 Javascript
js实现杯子倒水问题自动求解程序
2013/03/25 Javascript
js实现单行文本向上滚动效果实例代码
2013/11/28 Javascript
Nodejs Post请求报socket hang up错误的解决办法
2014/09/25 NodeJs
js+CSS实现模拟华丽的select控件下拉菜单效果
2015/09/01 Javascript
Nodejs Express4.x开发框架随手笔记
2015/11/23 NodeJs
点评js异步加载的4种方式
2015/12/22 Javascript
js事件冒泡、事件捕获和阻止默认事件详解
2016/08/04 Javascript
JavaScript数组操作函数汇总
2016/08/05 Javascript
JavaScript实现时钟滴答声效果
2017/01/29 Javascript
js获取指定时间的前几秒
2017/04/05 Javascript
JS触摸事件、手势事件详解
2017/05/04 Javascript
layer.open 子页面弹出层向父页面传输数据的例子
2019/09/26 Javascript
微信小程序 行的删除和增加操作实现详解
2019/09/29 Javascript
小程序按钮避免多次调用接口和点击方案实现(不用showLoading)
2020/04/15 Javascript
Vue为什么要谨慎使用$attrs与$listeners
2020/08/27 Javascript
[47:26]完美世界DOTA2联赛 LBZS vs Forest 第二场 11.07
2020/11/09 DOTA
Python中的类学习笔记
2014/09/23 Python
python使用chardet判断字符串编码的方法
2015/03/13 Python
python使用PyCharm进行远程开发和调试
2017/11/02 Python
简单实现python数独游戏
2018/03/30 Python
python生成n个元素的全组合方法
2018/11/13 Python
pygame游戏之旅 添加游戏暂停功能
2018/11/21 Python
python隐藏类中属性的3种实现方法
2019/12/19 Python
python 给图像添加透明度(alpha通道)
2020/04/09 Python
通过cmd进入python的步骤
2020/06/16 Python
全球性的在线购物网站:Zapals
2017/03/22 全球购物
台湾7-ELEVEN线上购物中心:7-11
2021/01/21 全球购物
销售冠军获奖感言
2014/02/03 职场文书
小摄影师教学反思
2014/04/27 职场文书
2015年商场工作总结
2015/04/27 职场文书
2015年文秘个人工作总结
2015/10/14 职场文书
2016年师德学习心得体会
2016/01/12 职场文书
Python 线程池模块之多线程操作代码
2021/05/20 Python