jQuery .click() 与 .on('click') 的区别

最新推荐文章于 2021-12-18 17:26:03 发布
原创 最新推荐文章于 2021-12-18 17:26:03 发布 · 536 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#jQuery

本文解析了jQuery中click与on(click)两种点击事件处理方法的区别，前者用于静态DOM元素，后者则适用于动态添加的元素，深入探讨了这两种方法在处理页面元素时的不同应用场景。

两个方法都是点击事件，但有什么区别呢？

$(selector).click(): 处理静态的DOM元素，HTML加载后的页面元素。
$(selector).on('click'): 处理动态的DOM元素，页面加载后动态添加的元素。

其他dblclick、事件也是一样的原理。

03-jQuery-事件绑定【click() 、on()】、事件切换toggle()、事件方法、样式控制
记录java学习日常~
05-20 1万+
on() 方法是 jQuery 中最常用且最通用的事件绑定方法，可以绑定多个事件类型，并为每个事件类型指定一个或多个处理程序。click() 方法是一种简洁的事件绑定方法，只能绑定 click 事件，并且只允许绑定一个处理程序，无法为同一个元素绑定多个处理程序。off() 方法用于移除之前绑定的事件处理程序，它需要传递一个或多个事件类型参数，并为这些事件类型制定要移除的处理程序。jQuery 事件绑定中，on() 方法用于为元素添加事件处理程序，off() 方法则用于移除绑定的事件处理程序。
jquery.onoff实现简单的开关按钮功能(推荐)
10-18
<link rel="stylesheet" href="../js/dist/jquery.onoff.css"/> <script src="../js/dist/jquery.onoff.js"> ``` 在HTML部分，需要写一个简单的复选框input，并为其添加一个onclick事件，代码如下： ```html (this)...
jQuery.click（）与onClick
asdfgh0077的博客
04-25 933
I have a huge jQuery application, and I'm using the below two methods for click events. 我有一个庞大的jQue
JQuery click 与 on('click', ...)
火柴头的专栏
06-29 624
&lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html&gt; &lt;head&gt; &lt;meta http-equiv="Content-Type" content="text/html; cha
(总结)jquery中.click()与.on("click")的不同
a13697013326的博客
07-31 391
这两个方法都是鼠标单击事件，但是$("").click()事件只能处理页面刚加载完已经存在的dom，而$("").on()可以处理页面加载完后，动态添加的dom元素。 这个回答很经典， 如果要为动态元素绑定事件，可以参考: 语法：$(selector).on(event,childSelector,data,function) 参考: https://blog.csdn.net/qq59...
JQ click()和on()的区别
qupeng666的博客
09-07 1978
click是点击事件，但是在页面加载完之后，jquery事件新添加的元素，用click的话是无法获取元素的，这个时候要用on去获取元素事件，简单的说页面加载完成时候页面显示的元素可以用on，也可以用click，但是页面加载完成之后后期再追加的元素只能用on
jquery手册(jquery.cuishifeng.cn网页版)2
10-18
3. **事件处理**: 使用`.on()`方法可以绑定事件，如`$(selector).on('click', function() {...})`表示当点击指定元素时执行函数。`.off()`用来移除事件绑定。 4. **动画效果**: jQuery的`.animate()`方法允许创建...
jquery.min.zip
09-17
例如，`.click(function() {...})`就能绑定点击事件，而`.on('mouseenter', function() {...})`则用于监听鼠标进入事件。 3. **动画效果**：jQuery的动画功能是其魅力之一，`.animate()`函数可以轻松实现平滑的CSS...
jquery.min.js jquery-1.4.2.min.js jquery-1.4.4.min.js jquery-1.10.2.min.js.zip
08-05
3. **事件处理**：jQuery的事件处理方式简洁易用，如`.click(fn)`用于绑定点击事件，`.on('event', fn)`用于动态绑定事件。 4. **动画效果**：jQuery的`.animate()`函数可以创建复杂的动画效果，而`.fadeIn()`, `....
jquery.js+jquery.min.js
11-27
3. **事件处理（Event Handling）**: jQuery统一了事件绑定的语法，如`click(function() {...})`用于绑定点击事件，`.on()`方法可支持多种事件绑定。 4. **动画效果（Animations）**: jQuery内置了动画功能，如`...
jQuery的on绑定click和直接绑定click区别
weixin_39037804的博客
10-07 378
状况之外 在之前的公司并没有遇到这个问题，也就没有深究。直到自己换了现在的公司，刚来第二天就开始写别人写到一半的项目，很无奈，不是原生就是jquery，由于项目急，已经来不及切换框架重新布局，只能继续...
关于js中的onclick事件和JQuery中的click方法以及on方法事件的详解以及区别
热门推荐
王金龙
07-03 4万+
jquey事件处理
.click()与on('click',function())
zhouzy539的博客
10-17 3万+
之前遇到过一次.click()无效，改成on绑定click就好了的情况，看了几篇博客后，发现是自己对click()和on的理解不够，没太在意，最近又遇到了，所以写下这篇博客加深印象。 $(选择器).click(fn)：当选中的选择器被点击时触发回调函数fn。只针对与页面已存在的选择器。而.J_del这个删除按钮是通过append加到页面上的 。所以.click()无效 .$(documen...
探讨jQuery中on()和click()的使用细节（区别）
Henry_626的博客
11-28 2109
今天在写一个聊天室程序中需要动态地添加和删除一些html元素，因为使用click()的过程中遇到了问题，在一番查阅后找到了问题的根源并改为使用on()成功解决，在此记录分享一下~ jQuery 中的on() 方法 ????语法： $(selector).on( events [, childSelector ] [, data ], handler(eventObject) ) events：类型: String 一个或多个空格分隔的事件类型和可选的命名空间，或仅仅是命名空间，比如"click", “
Jquery 中on()方法与click()事件的区别
风中的剑
02-14 1499
on() 方法： on()方法是在备选元素及子元素上添加一个或多个事件的处理程序 on()方法绑定事件适用于当前元素以及在未来动态生成的元素   click()： 单纯的Jquery 点击事件，在静态控件时于on()绑定的点击事件作用相同 $("#newclick").click(function(){     $(".li").append('&lt;li&gt;动态添加的HTM...
JQuery $().click()与$().on("click"...)区别
风不知从何处起的小屋
04-26 2001
jQuery的出现，大大简化了对dom的操作，但是如果不是仔细阅读api和进行操作，就不知道其中最大的优点和使用方式。就拿().click()和().click()和().click()和(document).on(‘click’,‘要选择的元素’,function(){})来说，都是点击事件的操作，但是也有不同的地方。 $(选择器).click(fn) 　当选中的选择器被点击时触发回调函数fn...
click和on click区别
欢迎来到 动感地带
06-04 2985
click和onclick的区别 onclick是绑定事件，告诉浏览器在鼠标点击时候要做什么；click本身是方法，作用是触发onclick事件，只要执行了元素的click()方法，就会触发onclick事件 click可以理解为一次简单的触发，只执行一次，找不到以后就不再执行；onclick则是给这个id注册一种行为，可以重复触发 click 是方法，onclick是事件。执行click就是模拟鼠标点击，同时会触发onclick事件。 所以说jquery的click点击事件会在点击下拉框的时候触发
jquery笔记
qq_41187108的博客
12-18 940
基础用法：$(selector).action()//对selector元素进行action()操作 $(selector)获取元素例子：$('p'),$('.test'),$('#id'),$('p .test'),$('p #id'),$('p div'),$("p:first"),$("ul li:first"),$(":button"),$("tr:even"),$("tr:odd") action()执行的方法例子：$(selector).click(function(参数){});这些方法要
Jquery on()和click()的区别
抵氏的博客
05-15 514
理清两者的区别 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script> <!-- on
jQuery库核心文件jquery.js解析与应用
其次是“事件处理”，jQuery 提供了统一的事件绑定接口，如 `.on()`、`.click()`、`.hover()` 等，能够屏蔽浏览器间的差异，确保事件在各种环境下稳定触发。此外，还支持命名空间事件和委托事件，便于大型项目的事件...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值