click事件在什么时候出发_关于JS 事件冒泡和onclick,click,on()事件触发顺序

今天在给JQgrid中的标签添加click事件的时候，发现一个问题。

JQgrid的table中，点击任何位置，都会勾选点击行的checkbox，而我希望在点击我的标签的时候，不要勾选checkbox。

查看JQgrid源码，发现它的click事件是绑定到了table上，然后判断事件点击目标，找到选中行给它勾选；而我的click事件是绑定到td里面的div中。

按照事件冒泡的触发顺序，应该是我的事件先触发，之后是JQgrid的事件。

结果不是这样的。我发现JQgrid使用$().click(function(){})绑定的事件，而我使用$("body").on("click","",function(){})绑定的事件。

我希望比较一下它们的差别，专门写了一下代码，查看运行结果。

代码如下：

Click this Div

JS：

$(function(){

$("body").on("click","#div_2",function(){

console.error("on bind click 2");

});

$("body").on("click","#div_1",function(){

console.error("on bind click 1");

});

$("#div_2").click(function(){

console.error("click 2");

});

$("#div_1").click(function(){

console.error("click 1");

});

执行结果：

得到结论：

onclick,click,on()的优先关系：onclick>click>on()；

onclick和click绑定的事件，彼此之间遵守事件冒泡规则，从内到外触发；

on()绑定的事件，总是晚于onclick和click绑定的事件触发；

由此可以得到，使用on()绑定的事件与onclick和click绑定的事件，判断触发先后顺序时，不能只考虑事件冒泡规则。

click事件在什么时候出发_关于JS 事件冒泡和onclick,click,on()事件触发顺序相关推荐

click事件在什么时候出发_超全的js事件机制amp;事件委托
超全的js事件机制&事件委托,想要理解js事件只需认真看完此篇即可~ 目录结构: 什么是事件机制事件冒泡事件捕获 DOM事件流事件委托误区在同一个对象上注册事件,并不一定按照注册顺序执行 ...
click事件在什么时候出发_剖析setTimeout和click点击事件的触发顺序
下面是一段非常简单的JavaScript代码 dianji setTimeout(function () { alert('timer handler') }, 2000) function test ...
js阻止子元素事件_阻止 JS 的冒泡事件
用了一段时间google inbox,赶脚mail task的样式很酷炫,于是也模仿着做了一个task管理系统. Google task有个behavior是点击页面别处,当前展开的mail就会收起. ...
关于JS 事件冒泡和onclick,click,on()事件触发顺序
今天在给JQgrid中的标签添加click事件的时候,发现一个问题. JQgrid的table中,点击任何位置,都会勾选点击行的checkbox,而我希望在点击我的标签的时候,不要勾选checkbox ...
click事件在什么时候出发_什么是移动端？
主要内容什么是移动端.移动端视口.rem em px区别.移动端适配.移动端布局和马蜂窝案例. 结合视频学习效果更佳: https://www.bjsxt.com/down/9319.htmlwww ...
jq onclick 定义_关于js中的onclick事件和JQuery中的click方法
1.onclick是绑定的事件(它是一个事件),注意该事件绑定只是JacaScript中有,Jquery中并没有此事件,告诉浏览器在鼠标点击时候要做什么测试onclick事件 function mo ...
addeventlistener事件第三个参数_简析JavaScript 事件绑定、事件冒泡、事件捕获和事件执行顺序...
这篇文章主要介绍了javaScript 事件绑定.事件冒泡.事件捕获和事件执行顺序整理总结的相关资料 (一)事件绑定的几种方式 javascript给DOM绑定事件处理函数总的来说有2种方式:在htm ...
vue事件修饰符：通过@click.self的self属性来阻止内层向外层冒泡
知识点: 事件流当一个HTML元素产生一个事件时,该事件会在元素节点与根节点之间的路径传播,路径所经过的节点会收到该事件,这个传播的过程叫做DOM事件流事件又分为冒泡事件捕获事件冒泡事件微 ...
js事件里面套事件怎么不管用_原生js利用localstorage实现简易TODO list应用
前言:小生不才,只懂得一些皮毛,我努力以最简单的语言将心中的想法表述出来,让更多人能够很轻松的弄明白.文章里面有不足之处望各位大牛指出,使得后面的文章能够朝着更好的方向发展.另外,大家记得点赞哟! 欢 ...

click事件在什么时候出发_关于JS 事件冒泡和onclick,click,on()事件触发顺序

click事件在什么时候出发_关于JS 事件冒泡和onclick,click,on()事件触发顺序相关推荐

最新文章

热门文章