jq的.click().on('click'）

最新推荐文章于 2025-10-18 09:20:01 发布
原创 最新推荐文章于 2025-10-18 09:20:01 发布 · 5.4k 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文详细解析了JQuery中.on()函数的使用方法，特别是如何动态绑定元素的click事件，即使页面元素在运行时发生变化，也能确保事件正确触发。通过实例说明，如在动态生成的li元素上绑定click事件，对比直接绑定与通过父元素绑定的区别。 
$（selector）.on('click',function(){ });

支持动态绑定元素，即页面上元素有添加或变化后仍可绑定,前提是selector须是目标绑定元素的父元素，如绑定body里的动态li元素：

$('body').on('click','ul li',function(){});

若直接绑定动态的li元素将不成功，效果与$(’’).click()相同。
$(’’).click()事件只能绑定静态元素。

详见：
JQuery.on() 函数详解
http://www.365mini.com/page/jquery-on.htm

03-jQuery-事件绑定【click() 、on()】、事件切换toggle()、事件方法、样式控制
记录java学习日常~
05-20 1万+
on() 方法是 jQuery 中最常用且最通用的事件绑定方法，可以绑定多个事件类型，并为每个事件类型指定一个或多个处理程序。click() 方法是一种简洁的事件绑定方法，只能绑定 click 事件，并且只允许绑定一个处理程序，无法为同一个元素绑定多个处理程序。off() 方法用于移除之前绑定的事件处理程序，它需要传递一个或多个事件类型参数，并为这些事件类型制定要移除的处理程序。jQuery 事件绑定中，on() 方法用于为元素添加事件处理程序，off() 方法则用于移除绑定的事件处理程序。
jq.zip
04-10
- **事件处理**：使用 `.on()` 方法绑定事件，如 `$(".element").on("click", function() {...})` 可监听点击事件。 - **CSS 操作**：通过 `.css()` 方法可以修改元素的样式，如 `$("#myElement").css("color", ...
jq onclick
qq_31459039的博客
11-30 2720
jQuery中，要使用attr()方法操作标签中的onclick属性必须使用jq库1.6或更新的库版本！针对标签属性的操作都是使用attr()方法来实现的 获取指定元素的属性值: $(选择器).attr(属性名) 如设置onclick属性： $("a").attr("onclick","test();"); 设置多个属性(题外话): $("a").attr({"href":"j...
jQuery .on() 方法完全指南：终极事件处理大师
最新发布
weixin_42107409的博客
10-18 343
本文全面介绍了jQuery的.on()方法，帮助开发者掌握事件处理的核心功能。文章首先解释了.on()作为统一事件处理接口的优势，重点介绍了其事件委托机制，通过将处理器绑定在静态父元素上，实现对动态内容的支持并提升性能。随后详细解析了.on()的基础语法和高级用法，包括多事件绑定、数据传递等技巧。特别介绍了事件命名空间的使用，帮助开发者精准控制事件移除。最后通过一个动态待办事项列表的实战案例，展示了如何综合运用.on()的各种功能。本文适合所有jQuery开发者学习，帮助编写更高效、健壮的JavaScrip
jquery onclick
放飞梦想
07-30 3382
$( "#members li a" ).on( "click", function( e ) {} ); $( "#members li a" ).bind( "click", function( e ) {} ); // Live $( document ).on( "click", "#members li a", function( e ) {} ); $( "#members ...
探讨jQuery中on()和click()的使用细节（区别）
Henry_626的博客
11-28 2133
今天在写一个聊天室程序中需要动态地添加和删除一些html元素，因为使用click()的过程中遇到了问题，在一番查阅后找到了问题的根源并改为使用on()成功解决，在此记录分享一下~ jQuery 中的on() 方法 ????语法： $(selector).on( events [, childSelector ] [, data ], handler(eventObject) ) events：类型: String 一个或多个空格分隔的事件类型和可选的命名空间，或仅仅是命名空间，比如"click", “
jQuery-on()函数
BERWIN89的博客
01-18 640
注意：使用 on() 方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）。 多个事件绑定同一个函数 $(document).ready(function(){   $("p").on("mouseover mouseout",function(){     $("p").toggleClass("intro");   }); }); 多个事
我想在onstart调用`PF('imgFileUpload').jq.click();`时阻塞方法,等选择完文件后,执行actionListener: <p:commandLink value="上传图档" onstart="PF('imgFileUpload').jq.click();" actionListener="#{nonStdPartBean.uploadImgFile(item)}" rendered="#{not nonStdPartBean.isRelatedRole('工程')}" /> <p:fileUpload id="imgFileUpload" widgetVar="imgFileUpload" value="#{nonStdPartBean.imgFile}" mode="simple" style="display: none" />
07-23
PF('imgFileUpload').jq.find('input[type="file"]').off('change').on('change', function() { // 3. 文件选择完成后，手动调用上传动作 setTimeout(function() { uploadImgAction(); // 调用 ...
jq的on事件.txt
08-27
jQuery on() 方法不生效问题，从版本原因，格式问题解读，示例分析。 on常用格式：采用后绑定事件，结构清晰，开发便捷，防止dom找不到无法绑定，兼容问题。
jQuery绑定事件方法及区别(bind,click,on,live,one)
10-19
$('#clickmeon').on("click", function() { alert("helloworldon"); }); ``` 如果你只需要让事件处理函数绑定一次，那么可以使用`one()`方法。这种方式与`bind()`类似，但是事件处理函数在触发后就会自动解绑。...
基于jquery的on和click的区别详解
11-28
使用jQuery写js时，有些用on写行为函数，有些用click，弄清二者区别很重要。 以下是用于测试二者区别的HTML代码。 <!DOCTYPE html> <%@ page language="java" contentType="text/html; charset=UTF-8" ...
jQuery 动态绑定事件 on.click 与 简单绑定 click ！
qq_53895518的博客
08-01 1680
上周小任务笔记 —> 在input 提交按钮，提交之前做下校验，所以需要动态获取页面的提交按钮。本来使用简单的写法获取不到，嵌套的input提交按钮，使用onclick动态绑定就解决啦！
Jquery on(“click“) 方法绑定事件后执行多次解决办法
w36680130的博客
11-16 309
Jquery on("click") 方法绑定事件后执行多次解决办法
JQ小坑on
kao5585682的博客
04-21 394
最近在写一个账单功能用到了DOM操作，要给新生成 标签添加CLICK时间，准备用JQ的on但是一直不生效，经过查资料 on事件要注意格式$(document).on('click','#beforepage',function(){ alert(1); }$('.date ul').on('click','li',function(){ alert(1); } 这2种写法都可以但是我只有第一种生
jQuery中的 .click()，on.('click')，one.('click')的区别
nijiangye的博客
09-29 1401
这里写自定义目录标题jQuery中的 .click()，on.('click')，one.('click')的区别.click()，on.('click') 的区别事件绑定解除事件 jQuery中的 .click()，on.(‘click’)，one.(‘click’)的区别 (′body′).click(function())和('body').click(function(){ })和(′bo...
(总结)jquery中.click()与.on("click")的不同
a13697013326的博客
07-31 396
这两个方法都是鼠标单击事件，但是$("").click()事件只能处理页面刚加载完已经存在的dom，而$("").on()可以处理页面加载完后，动态添加的dom元素。 这个回答很经典， 如果要为动态元素绑定事件，可以参考: 语法：$(selector).on(event,childSelector,data,function) 参考: https://blog.csdn.net/qq59...
.click()与on('click',function())
热门推荐
zhouzy539的博客
10-17 3万+
之前遇到过一次.click()无效，改成on绑定click就好了的情况，看了几篇博客后，发现是自己对click()和on的理解不够，没太在意，最近又遇到了，所以写下这篇博客加深印象。 $(选择器).click(fn)：当选中的选择器被点击时触发回调函数fn。只针对与页面已存在的选择器。而.J_del这个删除按钮是通过append加到页面上的 。所以.click()无效 .$(documen...
jQuery.on() 函数详解
戚小柒日常技术栈积累
02-07 3206
on()函数用于为指定元素的一个或多个事件绑定事件处理函数。 从jQuery 1.7开始，on()函数提供了绑定事件处理程序所需的所有功能，用于统一取代以前的bind()、 delegate()、 live()等事件函数。 on()支持直接在目标元素上绑定事件，也支持在目标元素的祖辈元素上委托绑定。在事件委托绑定模式下，即使是执行on()函数之后新添加的元素，只要它符合条件，绑定的事件处理函数
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值