jQuery中blur和focus事件的应用

最新推荐文章于 2024-02-11 09:00:00 发布
最新推荐文章于 2024-02-11 09:00:00 发布
阅读量1.3w 收藏 4
点赞数 1
分类专栏： jQuery 文章标签： jquery function input html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/gaolinwu/article/details/7240674
版权

jQuery中blur和focus事件的应用

一、需求原因

在填写表单时需要实现如下效果

二、具体实现

<!DOCTYPE html PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type"content="text/html; charset=UTF-8">

<title>鼠标点击后无文字，挪开鼠标后有文字</title>

<script language="JavaScript"src="../jQuery/jquery-1.7.1.min.js"></script>

<script type="text/javascript">

     $(function(){

         /*进入焦点时触发*/

         $("#account").focus(function(){

              varoldValue = $(this).val();

              if(oldValue == this.defaultValue){

                  $(this).val("");

              }

         }); 

         /*失去焦点时触发*/

         $("#account").blur(function(){

              alert("12");

              varoldValue = $(this).val();

              if(oldValue == ""){

                   $(this).val(this.defaultValue);

              }

         });

     });

</script>

</head>

<body>

          帐号：<input id="account"name="account" type="text" value="请输入帐号">

</body>

</html>

风吹雨碎
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
Jquery事件篇blur
weixin_44549330的博客
05-05 379
开发工具与关键技术：Visual Studio 2015 与 jQuery 撰写时间：2020年4月30日 Blur(): 当元素失去焦点时触发事件 该事件可以使两个或多个input内的值进行一定得操作 先写EndNotes绑定一个blur事件 $("#EndNotes").blur(function () {} 然后要获取input里面的值 通过ID获取input的值 var Start...
JQuery中focus()与blur()焦点事件
态度决定思路，思路决定出路！！！
10-10 7371
1.焦点事件focus()与blur() focus：获取对象焦点触发事件； $(function(){ $("xxx").focus(function(){ ............ }); });blur:失去对象焦点触发事件； $(function(){ $("xxx").blur(function(){ ...........
jQuery focus和blur事件
IT_beast的博客
08-15 499
<script type="text/javascript"> $(function(){ /*进入焦点时触发*/ $("#account").focus(function(){ }); /*失去焦点时触发*/ $("#account").blur(function(){ }); }); </script>
【JQuery】文本框的focus和blur事件
O(∩_∩)O
04-02 913
focus事件在元素获取焦点时触发，如点击文本框时，触发该事件； 而blur事件则在元素丢失焦点时触发，如点击除文本框的任何元素，都会触发该事件。 注意，这里的focus和blur是事件名，不是函数。 在给例子前先给一张图 主要是想说明用bind绑定多个事件的方式： $(selector).bind({event:function,event:function,.....
jQuery focus和blur事件的应用详解
12-10
一、需求原因在填写表单时需要实现如下效果二、具体实现 代码如下:<!DOCTYPE html PUBLIC “-//W3C//DTD...<head><... charset=UTF-8″><...script language=”JavaScript”src=”../jQuery/jquery-1.7.1.
jQuery中blur和focus
01-25
jQuery中blur和focus事件的应用,相关事例和代码
jQuery事件blur()方法的使用实例讲解
01-21
实例 当输入域失去焦点 (blur) 时改变其颜色： $(input).blur(function(){ $(input).css(background-color,#D6D6FF); }); <html> <head>... $(input).focus(function(){ $(input).css(bac
使用jquery给input和textarea设定ie中的focus
10-30
在网页开发中，交互体验是非常重要的...总结，通过结合CSS的`:focus`伪类和jQuery的事件处理，我们可以确保在各种浏览器中为input和textarea提供一致的焦点效果。这不仅提升了用户体验，也确保了网站的兼容性和一致性。
JavaScript的聚焦：focus/blur
最新发布
爱蹦跶的全栈大A阿
02-11 2022
focus和blur事件是用于检测元素是否获得或失去焦点的重要事件。它们可以用于各种目的，例如验证表单输入、控制元素的可见性等等。希望本文对你有所帮助！阅读 HTML 和 JavaScript 文档，以了解更多关于focus和blur事件的信息。练习使用focus和blur事件来实现不同的功能。在实际项目中使用focus和blur事件。祝你学习愉快！​。
jQuery事件--blur()和focus()
anqi771129的博客
12-03 846
blur([[data],fn]) 概述 当元素失去焦点时触发 blur 事件。 这个函数会调用执行绑定到blur事件的所有函数，包括浏览器的默认行为。可以通过返回false来防止触发浏览器的默认行为。blur事件会在元素失去焦点的时候触发，既可以是鼠标行为，也可以是按tab键离开的 参数 fn在每一个匹配元素的blur事件中绑定的处理函数 ...
jQuery语法知识（表单事件）
m0_59329828的博客
01-22 433
获取焦点。
事件类型——焦点事件（表单获取/失去光标）
m0_75203410的博客
04-04 1231
主要用到的就是我们JavaScript中的事件监听，来监听我们焦点事件的两个动作：①focus 获得焦点 ②blur 失去焦点。今天给大家分享一下前端JavaScript事件类型（鼠标事件，焦点事件，键盘事件，文本事件）中的焦点事件问题。在给标签类名的时候用了data-sch=“find”只是为了复习一下自定义命名法。这个是怎么实现的呢？
jquery 输入框失去焦点时 (blur)事件
热门推荐
qq_27361945的博客
05-08 3万+
jquery判断input输入框的值，用到input事件，blur事件，focus事件需求：当输入框有字或者正在输入时，右边的圆形取消按钮才出现。否则不出现。 //输入框正在输入时 $("#ipt").on('input',function(){ if(!($('#ipt').val()=='')){ ...
jQuery 事件 - blur() 方法
qq_29663071的博客
03-15 505
实例 当输入域失去焦点 (blur) 时改变其颜色： $("input").blur(function(){ $("input").css("background-color","#D6D6FF"); });
jquery_blur()方法
博主很懒，什么都没有写
11-23 1192
jquery_blur()方法： 当元素
焦点事件--focus、blur
小白小白从不日别的博客
09-23 442
获取焦点：focus 元素节点获得焦点时自动触发 失去焦点：blur 元素节点失去焦点时自动触发 语法： 获取焦点：节点.onfocus=function(){} 失去焦点：节点.onblur=function(){} 注意： 可以使用DOM0绑定也可以使用DOM2绑定 不支持事件冒泡 .borderGreen { border: 2px solid green; } .colorGr
jQuery 事件中 bind 方法和blur() 方法
叶落无痕的博客
04-24 1万+
1.bind 方法 定义和用法 bind() 方法向被选元素添加一个或多个事件处理程序，以及当事件发生时运行的函数。 自jq版本1.7起，on()方法是被选中元素添加事件处理程序的首选方法 语法 $(selector).bind(event,data,function,map) 参数 描述 event
jquery中有哪些基础事件
06-02
在jQuery中，常用的基础事件包括： 1. click：鼠标单击事件。 2. dblclick：鼠标双击事件。 3. mouseover：鼠标移入事件。 4. mouseout：鼠标移出事件。 5. mousedown：鼠标按下事件。 6. mouseup：鼠标松开事件。 7. keydown：键盘按下事件。 8. keyup：键盘松开事件。 9. change：表单元素值改变事件。 10. submit：表单提交事件。 11. focus：元素获取焦点事件。 12. blur：元素失去焦点事件。 以上事件是jQuery中最常用的基础事件，可以根据实际需求在相应元素上绑定相应事件处理函数，实现相应的功能。同时，jQuery也支持自定义事件，可以使用trigger()方法手动触发自定义事件。
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值