focus通过document委托绑定

2024-11-04

focus如何实现事件委托

事件委托是利用事件冒泡机制的一种优化手段,如果有很多列表元素要绑定事件,那么就可以用事件委托来优化(不需要给每个元素都绑定事件).但是对于focus这种特殊的表单事件,它不会冒泡,那么又该如何实现这一优化呢?有的人会说这个会同时触发click,但是如果我是通过tab切换呢? js事件机制 js的事件机制有两种,事件冒泡和事件捕获,冒泡呢就是从触发事件的节点开始一层一层的往父节点传播:而事件捕获恰恰相反,是从根节点(document)往子节点中传播. dom事件 1.DOM0级事件处理 dom.o

jquery 事件委托绑定click的使用方法

直接绑定ul的click事件代码如下复制代码 $("ul").click(function(e) 例子代码如下复制代码 $(function(){ //$("ul").on('click',this,function(e){ $("ul").click(function(e){ $target = $(e.target); if ($target.is("h3")) { alert("h3&quo

ios手机访问H5页面中$(document).on绑定无效问题

1.问题描述用amazeUI做了个手机端网站,网站头部是一个点击按钮下拉菜单,点击页面其余区域下拉菜单隐藏.在chrome模拟安卓和iOS都可以正常触发,但是在真机实测的时候,iOS上面失效了.简单代码描述如下 $(document).on("click", function (e) { $("#collapse-head").css("display", "none") }); function里面的代码不会执行. 2.解

对事件委托绑定click的事件的解绑

大家都知道解绑事件的jquery写法,很简单: $("xxx").unbind("click"); 然后对于事件委托式的事件绑定,亲测,这种解绑方法是无效的, $(".sideNav>ul").on("click", function (e) { alert("aaa"+$(e.tagert).index()); } 即使做判断让一部分带有某个class的li标签的ul解绑click,依然无效,事件委

记录一个关于 Document.on绑定事件后，导致页面卡顿的情况

假设当前页面的js文件中有如下函数: function A(){ function B(); } function B(){ $(document).on("click","#元素id",function(){ dosomething……; }); } 函数A是一个按钮上绑定的onclick函数处理: 那么每次点击按钮触发A函数之后,都会导致B函数的执行,进而 $("#元素id") 这个元素就会绑定一次点击事件. 如果多次触发A函数之后,导致 $

document.writeln绑定数据 --点击跳转添加样式

document.writeln(" "); document.writeln(" "); document.writeln(" "); document.writeln(" "); document.writeln(" <p class='icon icon1'> "); document.writeln(" 订单 "); document.writeln("&q

js事件委托

什么是事件委托:通俗的讲,onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某些元素上的,然而你却加到别人身上来做,完成这个事件. 也就是:利用冒泡的原理,把事件加到父级上,触发执行效果. 好处1,提高性能. 先看一个例子:需要触发每个li来改变他们的背景颜色. <ul id="ul"> <li>aaaaaaaa</li> <li>bbbbbbb</li> &l

整理了一些jQuery关于事件冒泡和事件委托的技巧

首先,大家都知道,jQuery事件触发时有2种机制,一种是事件委托,另一种是事件冒泡(IE情况暂时不考虑).拿click事件做例子,先附上一段代码: html: <body> <div id="box"> <p id="btn">我是按钮</p> </div></body> style: .hid{ display:none; } script: $('#box').click(function

jQuery事件绑定方法bind、 live、delegate和on的区别

我们试图绑定一些事件到DOM元素上的时候,我相信上面这4个方法是最常用的.而它们之间到底有什么不同呢?在什么场合下用什么方法是最有效的呢? 1.准备知识当我们在开始的时候,有些知识是必须具备的: 1).DOM树下图仅仅是一个示例,这是一个在browser环境下的一棵模拟DOM树,在下面的代码中仅起到演示的作用: 2).Event bubbling (aka event propagation)冒泡我们的页面可以理解为一棵DOM树,当我们在叶子结点上做什么事情的时候(如click一个a元素)

jq 事件取消绑定与重新绑定

前端有时会碰到这样的需求: 点击某个元素发送ajax请求, 发送期间此元素的鼠标相关事件(比如点击)无效, 发送完成鼠标点击事件功能恢复, 对于这种需求, 我们会遇到两种情况, 一种是点击的按钮为form表单元素, 例如是 type="submit"的button的话, 由于是表单元素, 可使用属性 disabled 禁用第二种是非form表单元素, 例如是一个div元素, 非表单元素不存在 disabled 属性, 可使用 pointer-events: none 这个css属性

理解jquery on 委托事件的机制

前两天做了一个点击任意位置,都能关闭菜单的功能,因为菜单里面的每一个a,的点击事件都是用on绑定的.所以在阻止冒泡的时候不管用,今天特意来理解一下on的机制 on 是委托事件,利用的就是冒泡原理 $(selector).on(event,[selector],handler); selector 如果为空,表示的就是目标元素就是所选元素,如果有值代表的是符合所选元素的所有后代元素实际上,事件委托的事件处理函数是当被委托的元素上的事件触发时判断e.target后执行,而不是目标元素上的事件被触发

jquery事件之事件委托和事件切换

一.事件委托函数: 方法名说明语法 (events 事件类型,data数据,handler 事件处理函数,selector 选择器) live 用于为指定元素的一个或多个事件绑定事件处理函数. jQueryObject.live( events [, data ], handler ) jQueryObject.one( eventObject ) die 主要用于解除由live()函数绑定的事件处理函数. jQueryObject.die( [ events [, handler ]] )

JavaScript--事件委托--冒泡

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> li{ border: 1px solid #ddd; cursor: pointer; } </style> <script> /** * 事件委托: * 事件委托添加事件,其

C#基础篇 - 理解委托和事件

1.委托委托类似于C++中的函数指针(一个指向内存位置的指针).委托是C#中类型安全的,可以订阅一个或多个具有相同签名方法的函数指针.简单理解,委托是一种可以把函数当做参数传递的类型.很多情况下,某个函数需要动态地去调用某一类函数,这时候我们就在参数列表放一个委托当做函数的占位符.在某些场景下,使用委托来调用方法能达到减少代码量,实现某种功能的用途. 1.1.自定义委托声明和执行一个自定义委托,大致可以通过如下步骤完成: 利用关键字delegate声明一个委托类型,它必须具有和你想要传递的方

[转载]C#深入分析委托与事件

原文出处: 作者:风尘浪子原文链接:http://www.cnblogs.com/leslies2/archive/2012/03/22/2389318.html 同类链接:http://www.cnblogs.com/SkySoot/archive/2012/04/05/2433639.html 引言本篇文章将为你介绍一下 Delegate 的使用方式,逐渐揭开 C# 当中事件(Event)的由来,它能使处理委托类型的过程变得更加简单.还将为您解释委托的协变与逆变,以及如何使用 Deleg

委托学习笔记后续：泛型委托及委托中所涉及到匿名方法、Lambda表达式

引言: 最初学习c#时,感觉委托.事件这块很难,其中在学习的过程中还写了一篇学习笔记:委托.事件学习笔记.今天重新温故委托.事件,并且把最近学习到和委托相关的匿名方法.Lambda表达式及泛型委托记录下来,以备复习使用. 委托: 日常工作中,常常见到委托用在具体的项目中.而且委托使用起来相对来说也是非常简单的,下面列举一个委托实例用以说明如何使用委托,代码如下: class Program { public delegate int CalculateDelegate(int x, int y)

jQuery1.9及其以上版本中动态元素on绑定事件无效解决方案

jQuery 1.9/2.0/2.1及其以上版本无法使用live函数了,然而jQuery 1.9及其以上版本提供了on函数来代替.本文讲解了jQuery on函数的使用方法,以及在使用jQuery函数中遇到的一些问题. $(selector).on(event,childSelector,data,function,map) 各个参数说明如下: 参数描述 event 必需.规定要从被选元素移除的一个或多个事件或命名空间.由空格分隔多个事件值.必须是有效的事件. childSelector 可选

Delegate（委托与事件）

Delegate可以当它是一个占位符,比如你在写代码的时候并不知道你将要处理的是什么.你只需要知道你将要引入的参数类型和输出类型是什么并定义它即可.这就是书本上所传达的方法签名必须相同的意思. 系统自带的泛型委托 Action 无参数无返回值 Action<T> 没有返回值,最多有16个参数 Action<int> func = e => Console.WriteLine(e); func(123) Func 具有返回值,最多有16个参数 Func<int> f

C#委托，事件最初浅的和最易看懂的学习笔记

对于委托和事件,看了不少博文,当时好像都理解了,过了一段时间,又忘记的差不多了.每每如此,感觉自己很笨,记性差,其实是没有深入理解透切,没有按照自己的语言表达出来,当然容易忘记.今天又花了一些时间,好好理解,总结别人的文章,用自己文字概况出来. 总结如下: 委托可以定义任何地方,应该说是委托声明事件类可以单独放一个地方,包含一些属性事件一定定义在发布者里面,应该说是事件声明,并在这里做判断注册事件,给事件类属性赋值订阅者,也就是事件的受理者,它里面有些方法并后续操作. 客户端把发布者与订阅

委托Delegate，多播委托和委托链

定义一个委托 public delegate void CalculateDelegate(int 32 x,int 32 y); 定义一个委托类型的变量 public static CalculateDelegate mydelegate; 定义一个方法和委托绑定,注意定义的方法和委托的参数要统一 public static void Add(int 32 x,int 32 y) { console.writeline(x+y); } 将方法和委托绑定 public static vo

C#综合揭秘——深入分析委托与事件

http://www.cnblogs.com/leslies2/archive/2012/03/22/2389318.html 引言本篇文章将为你介绍一下 Delegate 的使用方式,逐渐揭开 C# 当中事件(Event)的由来,它能使处理委托类型的过程变得更加简单.还将为您解释委托的协变与逆变,以及如何使用 Delegate 使 Observer(观察者)模式的使用变得更加简单.在事件的介绍上,会讲述事件的使用方式,并以ASP.NET的用户控件为例子,介绍一下自定义事件的使用.最后一节,将

focus通过document委托绑定

热门专题