【五】jquery之事件（focus事件与blur事件）[提示语的出现及消失时机]
例题：当鼠标移动到某个文本框时，提示语消失。 当失去焦点时，如果该文本框有内容，保存内容。没有内容，则恢复最初的提示语句
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<meta charset="UTF-8">
</head>
<body>
<input type="text" id="login" value="test_cmf" />
<br/>
<input type="password" />
<script type="text/javascript">
//focus事件
//1.当login文本框有焦点的时候，文本框的值为空
//2.否则取当前值
$(document).ready(function(){
$("#login").focus(function(){
$current=$(this).val();
if ($current==this.defaultValue) {
$("#login").val("");
}else{
$("#login").val($current);
}
});
});
//blur事件
//1.当login文本框的内容为空时，给他设置当前值
//2.否则取当前值
$(document).ready(function(){
$("#login").blur(function(){
$current=$(this).val();
if ($current=="") {
$("#login").val(this.defaultValue);
}else{
$("#login").val($current);
}
});
});
</script>
</body>
</html>
界面：
【五】jquery之事件（focus事件与blur事件）[提示语的出现及消失时机]的更多相关文章
- 说说focus /focusin /focusout /blur 事件
事件触发时间 focus:当focusable元素获得焦点时,不支持冒泡:focusin:和focus一样,只是此事件支持冒泡:blur:当focusable元素失去焦点时,不支持冒泡:focusou ...
- focus /focusin /focusout /blur 事件
事件触发时间 focus:当focusable元素获得焦点时,不支持冒泡:focusin:和focus一样,只是此事件支持冒泡:blur:当focusable元素失去焦点时,不支持冒泡:focusou ...
- 下拉框click事件与搜索框blur事件的爱恨纠葛
还原车祸现场 功能类似于百度搜索,搜索框输入内容,下拉框显示候选项,点击候选项就选择候选项,然后下拉框隐藏,点击外面就直接隐藏下拉框,于是我写了以下代码 //参会单位联想 $('input[name= ...
- input输入框的的input事件和change事件以及change和blur事件的区别
input输入框的 oninput事件 ,在用户输入的时候触发,只要元素值发生变化就会触发 input输入框的 onchange事件 ,要在输入框失去焦点的时候触发事件,当鼠标在其他地方点击一下才会触 ...
- input 输入框 change 事件和 blur 事件
输入框的 change 和 blur 事件绝大多数情况下表现是一致的,输入结束后离开输入框会先后触发 change 和 blur.那么这两个事件的区别在哪呢? 当文本框获得焦点后,没有输入任何内容, ...
- jQuery 1.4版本的15个新功能（现在已经发布到jquery1.8,特别是增强版的live事件，支持 submit ， change ， focus 和 blur 事件）
1.jQuery()创建DOM元素:支持传参设置属性 之前,jQuery可以通过 attr 方法设置元素的属性,既可传属性的名和值,也可以是包含几组特定 属性名值对 的 对象.在 jQuery 1.4 ...
- jQuery - focusin/focusout/focus/blur事件的区别与不同
focus与blur事件:不支持冒泡 focusin与focusout:支持冒泡 事件触发顺序: 对于同时支持这4个事件的浏览器,事件执行顺序为focusin(聚焦) > focus > ...
- jquery easyui textbox onblur事件，textbox blur事件无效解决方案
jquery easyui textbox onblur事件,textbox blur事件无效解决方案 >>>>>>>>>>>> ...
- focus、blur事件的事件委托处理(兼容各个流浏览器)
今天工作中遇到个问题,问题是这样的,一个form表单中有比较多的input标签,因为form中的input标签中的值都需要前端做客户端校验,由于本人比较懒而且特不喜欢用循环给 每个input元素添加b ...
随机推荐
- vue2.0 源码解读(一)
又看完一遍中文社区的教程接下来开始做vue2.0的源码解读了! 注:解读源码时一定要配合vue2.0的生命周期和API文档一起看 vue2.0的生命周期分为4主要个过程 create. 创建---实例 ...
- PHP(一般标签介绍，标签特性，实体名称，绝对路径与相对路径）
h1:为标题 h1~h6 标题会逐渐变小 需更换标签里面的数字 如: <h1>这是标题123</h1>---标题 <h2>这是标题123</h2>-- ...
- stm32f7699遇到的犯二问题
没有看到stlink的驱动,难道板子坏了?? 结果:USB线的问题,换了一根用过的线,就行了:
- Codeforces 1090B - LaTeX Expert - [字符串模拟][2018-2019 Russia Open High School Programming Contest Problem B]
题目链接:https://codeforces.com/contest/1090/problem/B Examplesstandard input The most famous characters ...
- vue:不同环境配置不同打包命令
修改prod.env.js 'use strict'const target = process.env.npm_lifecycle_event;if (target == 'build') { // ...
- h5新增标签及css3新增属性
- h5新增的标签 新增元素 说明 video 表示一段视频并提供播放的用户界面 audio 表示音频 canvas 表示位图区域 source 为video和audio提供数据源 track 为vi ...
- svn 目录
svn介绍 SVN与Git的区别 SVN服务的模式和多种访问方式 多种访问原理图解与优缺点 SVN安装部署 svn 部署 配置 配置svn用户及密码 配置svn用户及权限 svn 启动命令讲解 svn ...
- return ajax 把ajax链式操作 简易封装
成功就是done,失败就是fail
- 下拉选择插件select2赋值、创建、清空
在select2中,设置指定值为选中状态 $("#select2_Id").val("XXXXX").select2()或者$("#latnId&qu ...
- U-boot2010.06移植--阶段一
2011-02-24 23:14:57 我今天的移植将分如下3步.加上写记录文档,预计时间3小时. 一,不改变源码,完成编译. 二,修改源码,搭建一个U-boot的框架,完成编译. 三,修改源码,完成 ...