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

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

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

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

$（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

jQuery的on方法的参数详解
ByteProwl的博客
10-06 468
jQuery是一个广泛应用于前端开发的JavaScript库，它提供了丰富的功能和简化的语法，使得操作网页元素和处理事件变得更加便捷。它可以用于为一个或多个元素绑定一个或多个事件，并在事件触发时执行相应的处理函数。其中，selector表示要绑定事件的元素选择器，event表示要绑定的事件类型，handler表示事件触发时要执行的处理函数。on方法还支持传递额外的参数，以及使用事件委托的方式绑定事件。以上是对jQuery的on方法参数的详细解释和使用示例。下面将详细介绍on方法的参数及其使用方式。
探讨jQuery中on()和click()的使用细节（区别）
Henry_626的博客
11-28 2078
今天在写一个聊天室程序中需要动态地添加和删除一些html元素，因为使用click()的过程中遇到了问题，在一番查阅后找到了问题的根源并改为使用on()成功解决，在此记录分享一下~ jQuery 中的on() 方法 ????语法： $(selector).on( events [, childSelector ] [, data ], handler(eventObject) ) events：类型: String 一个或多个空格分隔的事件类型和可选的命名空间，或仅仅是命名空间，比如"click", “
03-jQuery-事件绑定【click() 、on()】、事件切换toggle()、事件方法、样式控制
热门推荐
记录java学习日常~
05-20 1万+
on() 方法是 jQuery 中最常用且最通用的事件绑定方法，可以绑定多个事件类型，并为每个事件类型指定一个或多个处理程序。click() 方法是一种简洁的事件绑定方法，只能绑定 click 事件，并且只允许绑定一个处理程序，无法为同一个元素绑定多个处理程序。off() 方法用于移除之前绑定的事件处理程序，它需要传递一个或多个事件类型参数，并为这些事件类型制定要移除的处理程序。jQuery 事件绑定中，on() 方法用于为元素添加事件处理程序，off() 方法则用于移除绑定的事件处理程序。
基于jquery的on和click的区别详解
11-28
使用jQuery写js时，有些用on写行为函数，有些用click，弄清二者区别很重要。 以下是用于测试二者区别的HTML代码。 <!DOCTYPE html> <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%> <ht
jQuery 事件
最新发布
likuoelie的博客
06-24 914
jQuery 事件是处理网页用户操作的核心功能，例如点击按钮或提交表单。研究表明，jQuery 通过简洁的 API 使事件处理变得容易，适合初学者和中级开发者。事件处理程序是当 HTML 元素发生特定动作时调用的方法。jQuery 事件是处理用户交互的核心功能，提供了简洁的语法和强大的功能。通过使用.on()方法或快捷方法（如.click()），开发者可以轻松绑定和处理各种事件。方法确保了代码在 DOM 加载完成后执行，避免了常见的问题。
jq onclick
qq_31459039的博客
11-30 2699
jQuery中，要使用attr()方法操作标签中的onclick属性必须使用jq库1.6或更新的库版本！针对标签属性的操作都是使用attr()方法来实现的 获取指定元素的属性值: $(选择器).attr(属性名) 如设置onclick属性： $("a").attr("onclick","test();"); 设置多个属性(题外话): $("a").attr({"href":"j...
jquery onclick
放飞梦想
07-30 3367
$( "#members li a" ).on( "click", function( e ) {} ); $( "#members li a" ).bind( "click", function( e ) {} ); // Live $( document ).on( "click", "#members li a", function( e ) {} ); $( "#members ...
jq.zip
04-10
- **事件处理**：使用 `.on()` 方法绑定事件，如 `$(".element").on("click", function() {...})` 可监听点击事件。 - **CSS 操作**：通过 `.css()` 方法可以修改元素的样式，如 `$("#myElement").css("color", ...
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()`类似，但是事件处理函数在触发后就会自动解绑。...
flag和jq on 的绑定多个对象和方法(必看)
12-10
jquery中函数里的$(this)为什么和$(e.target）不相等？ ... <button id="myBtn">我的按钮</button> [removed] $('#myBtn').click(function(e){ ...因为用了jq来构造两个对象，所以你最后一
jQuery-on()函数
BERWIN89的博客
01-18 614
注意：使用 on() 方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）。 多个事件绑定同一个函数 $(document).ready(function(){   $("p").on("mouseover mouseout",function(){     $("p").toggleClass("intro");   }); }); 多个事
jQuery 动态绑定事件 on.click 与 简单绑定 click ！
qq_53895518的博客
08-01 1643
上周小任务笔记 —> 在input 提交按钮，提交之前做下校验，所以需要动态获取页面的提交按钮。本来使用简单的写法获取不到，嵌套的input提交按钮，使用onclick动态绑定就解决啦！
Jquery on(“click“) 方法绑定事件后执行多次解决办法
w36680130的博客
11-16 290
Jquery on("click") 方法绑定事件后执行多次解决办法
JQ小坑on
kao5585682的博客
04-21 383
最近在写一个账单功能用到了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 1374
这里写自定义目录标题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 378
这两个方法都是鼠标单击事件，但是$("").click()事件只能处理页面刚加载完已经存在的dom，而$("").on()可以处理页面加载完后，动态添加的dom元素。 这个回答很经典， 如果要为动态元素绑定事件，可以参考: 语法：$(selector).on(event,childSelector,data,function) 参考: https://blog.csdn.net/qq59...
jQuery.on() 函数详解
戚小柒日常技术栈积累
02-07 3182
on()函数用于为指定元素的一个或多个事件绑定事件处理函数。 从jQuery 1.7开始，on()函数提供了绑定事件处理程序所需的所有功能，用于统一取代以前的bind()、 delegate()、 live()等事件函数。 on()支持直接在目标元素上绑定事件，也支持在目标元素的祖辈元素上委托绑定。在事件委托绑定模式下，即使是执行on()函数之后新添加的元素，只要它符合条件，绑定的事件处理函数
jq on bind
09-19
在jq中，`on`命令用于将事件处理程序绑定到匹配选择器的元素上。当事件触发时，绑定的处理程序将被执行。 以下是`on`命令的用法： ```bash jq 'on(eventType; selector; eventHandler)' ``` - `eventType`：事件类型，可以是`click`、`keydown`、`keyup`等等。 - `selector`：选择器，用于指定要绑定事件处理程序的元素。 - `eventHandler`：事件处理程序，可以是一个jq函数或表达式。 示例： ```bash jq 'on("click"; ".button"; .text = "Button clicked!")' ``` 该示例将事件处理程序绑定到选择器为`.button`的元素上，当点击按钮时，将修改该元素的文本为"Button clicked!"。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值