文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

On( ) click是针对jquery中最后一个附加的div而不是所有附加的div执行的

On( ) click是针对jquery中最后一个附加的div而不是所有附加的div执行的。

在jQuery中，on()方法用于为元素绑定事件处理程序。它可以用于动态添加的元素，以及已经存在的元素。on()方法可以接受多个参数，其中第一个参数是事件类型，第二个参数是选择器，用于指定要绑定事件的元素。

在给定的问答内容中，on() click是一个事件绑定的示例。它指定了一个click事件处理程序，但没有提供具体的选择器。在这种情况下，事件处理程序将应用于最后一个附加的div元素，而不是所有附加的div元素。

这种行为是由jQuery的事件委托机制实现的。事件委托允许将事件处理程序绑定到父元素上，而不是直接绑定到子元素上。当事件触发时，事件将冒泡到父元素，并且jQuery将检查事件的目标元素是否匹配指定的选择器。如果匹配成功，事件处理程序将被触发。

对于这个问题，如果想要针对所有附加的div元素执行事件处理程序，可以使用以下代码：

代码语言：txt
复制
$(document).on('click', 'div', function() {
  // 事件处理程序代码
});

这样，无论是已经存在的div元素还是动态添加的div元素，都会触发事件处理程序。

腾讯云相关产品和产品介绍链接地址：

  • 腾讯云官网：https://cloud.tencent.com/
  • 云服务器（CVM）：https://cloud.tencent.com/product/cvm
  • 云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
  • 人工智能平台（AI Lab）：https://cloud.tencent.com/product/ailab
  • 云存储（COS）：https://cloud.tencent.com/product/cos
  • 区块链服务（Tencent Blockchain）：https://cloud.tencent.com/product/tencentblockchain
相关搜索:Jquery -如何检查div中的所有输入是否都不是空的？为什么只显示最后一个元素而不是JavaScript中的所有元素为什么在应用填充时<p>会在另一个<div>中结束，而不是在中展开它的div？使用JS/jQuery删除WordPress页面中div中的最后一个逗号使用动态值将href标记附加到jQuery中的div动态合并不同数组中的所有对象(附加名称而不是忽略)如何使用jquery将隐藏的div附加到另一个div中并仅在其中显示它如何在javascript而不是jquery中更改父div的css如何在不删除div本身的情况下，只使用JavaScipt而不使用jQuery来删除div中的所有内容？如何将div附加到jquery中的特定div？
相关搜索:
页面内容是否对你有帮助？
有帮助
没帮助

相关·内容

4-Jquery学习四-事件操作

: "王五" }; //为div中的所有p元素的click事件绑定事件处理函数 //只有n2、n3可以触发该事件 $("div p").bind("click", function(){ // 这里的...同样以初始HTML代码为例，我们可以编写如下jQuery代码： // 为div中的所有p元素绑定click事件处理程序 // 只有n2、n3可以触发该事件 $("div").on("click", "p...2-triggerHandler()触发事件只针对jQuery对象中的第一个匹配元素。 3-triggerHandler()触发的事件不会在DOM树中冒泡，因此事件不会冒泡传递到它的任何祖辈元素。...4-triggerHandler()的返回值是对应事件处理函数的返回值，而不是当前jQuery对象本身。...这里介绍的load()是一个事件函数，jQuery中还有一个同名的Ajax函数load()，用于通过Ajax加载html文档内容。

4.4K90

02-老马jQuery教程-jQuery事件处理

第二，只触发jQuery对象集合中第一个元素的事件处理函数。 第三，这个方法的返回的是事件处理函数的返回值，而不是据有可链性的jQuery对象。...], fn) 说明：jQuery 给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效。...要删除特定的委派事件处理程序，提供一个selector 的参数。选择器字符串必须是完全匹配递到.on()事件处理程序附加的选择器。要删除非委托元素上的所有事件，使用特殊值 "**" 。...event.currentTarget 在事件冒泡阶段中的当前DOM元素 event.delegateTarget 此属性是最经常有用是通过过.delegate() 或.on()附加委派的事件，事件处理程序附加在正在处理的元素的祖先上...event.result 这个属性包含了当前事件事件最后触发的那个处理函数的返回值，除非值是 undefined event.which 针对键盘和鼠标事件，这个属性能确定你到底按的是哪个键或按钮。

6.4K00

02-老马jQuery教程-jQuery事件处理

fn的内部作用域中this指向当前的DOM对象（注意不是jQuery的包装对象) 返回值： jQuery的包装对象！！！...第二，只触发jQuery对象集合中第一个元素的事件处理函数。 第三，这个方法的返回的是事件处理函数的返回值，而不是据有可链性的jQuery对象。..., fn) 说明：jQuery 给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效。...要删除特定的委派事件处理程序，提供一个selector 的参数。选择器字符串必须是完全匹配递到.on()事件处理程序附加的选择器。要删除非委托元素上的所有事件，使用特殊值 "**" 。...event.result 这个属性包含了当前事件事件最后触发的那个处理函数的返回值，除非值是 undefined event.which 针对键盘和鼠标事件，这个属性能确定你到底按的是哪个键或按钮。

2.7K80

JavaScript 事件委托 以及jQuery对事件委托的支持

真正做事情的是乙，即被委托人，而委托人甲 则是把相应的信息传递给被委托人乙，自己本该做的事情交给了乙来做，如下图这个例子： ?       那么在我们javascript 里，什么是事件委托呢？...type:     附加到元素的一个或多个事件。由空格分隔多个事件值。必须是有效的事件。...fn   : 相应的处理函数 描述：jQuery 给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效。...从元素中删除先前用.live()绑定的所有事件.(此方法与live正好完全相反。)如果不带参数，则所有绑定的live事件都会被移除。...大多数的事件会冒泡，但是并不是所有的。对于其他的浏览器而言，捕获阶段也会同样适用。

78360

jq---方法总结

什么是jQuery 在使用jQuery之前，我们必须先了解什么是jQuery，它能够干什么(不然我们为啥要用它)。 jQuery是一个非常流行的快速、小巧、功能强大的开源JavaScript库。...2.版本的区别 jQuery库的js文件一般有两个版本：一个是jquery-version.js(这里的version表示具体版本号，下同)，一个是jquery-version.min.js。...class="foo bar">Hello CodePlayer'); // 包含一个临时的div元素，其内嵌一个子节点p元素 六：元素的筛选 // 以下方法都返回一个新的jQuery...$("ul li").last(); // 选取ul li中匹配的最后一个元素 $("ul li").slice(1, 4); // 选取第2 ~ 4个元素 $("ul li").filter(":even...属性 find("ul") // 返回匹配这些div元素中的所有后代ul元素的jQuery对象 children() // 返回匹配这些ul元素中的所有子代元素的jQuery对象 $("selector

3K20

jQuery学习笔记

jQuery初学者笔记 一 Mirror王宇阳 by jQuery语法 jQuery语法是通过选取HTML元素，并对选取的元素进行操作 基础语法： 所有jQuery语句用“$”符号开始 <!...函数位于一个document ready函数中，我们需要在js中加载该函数文档 // jQuery入口函数 $(document).ready(function(){ //jQuery代码 }...、或将函数绑定到指定元素的 double click 事件 | |delegate() |向匹配元素的当前或未来的子元素附加一个或多个事件处理器 | |die() |移除所有通过...删除元素的class加载 empty() 删除被选元素的子元素 jQuery CSS 获取/设置 addClass() 向被选元素添加一个或多个Class类 removerClass() 从被选元素中删除指定的一个或多个...() 返回被选元素与参数之间的所有同级元素 遍历 过滤 first() 返回被选元素的首个子元素 last() 返回被选元素的最后子元素 eq() 返回被选元素中带有指定索引的元素(可选参数

7.4K30

Jquery的属性操作和DOM操作

中offset和position的区别     JQ中的两个方法都返回一个包含两个属性的对象－左边距和上边距，它们两个的不同点在于位置的相对点不同。    ...删除所有子节点），绑定的事件，附加的数据都会移除         2 detach（）从DOM中删除所有匹配的元素（）与remove（）不同的是，绑定的事件，附加的数据都会被保留下来        3...replaceAll()：用指定的HTML内容或元素替换被选元素     3 each（）遍历   过滤 first()/last()方法返回被选元素的首个元素/最后一个元素。...eq()方法返回被选元素中带有指定索引号的元素               索引号从0开始，因此首个元素的索引号是0而不是1          3  not（）方法返回所有不匹配的元素          ...4 is（）判断所有元素中是否有符合某个条件的元素，返回布尔值           5  has（）方法返回拥有匹配指定选择器的一个或多个元素在其内的所有元素 演示文档</title

1.3K20

jQuery 基本语法

示例解析： 上边的效果是点击文档中所有a标签时将弹出对话框（alert），其中，$("a") 是一个jQuery选择器，$本身表示一个jQuery类，所有$()是构造一个jQuery对象，click(...返回的是jQuery对象，get返回的是所匹配的dom对象，所有取$("p").eq(1)对象的内容用jQuery方法html()，而取$("p").get(1)的内容用innerHTML index(...$("p").add(document.getElementById("a")); add(els)  在匹配对象的基础上在附加指定的一组对象，els是一个数组。 ?...:blue">css 取它的background语法是 document.getElementById("a").style.background， 而jQuery对css更方便的操作，$(...5类 举例，click(fn) 扩展 click()  unclick()  oneclick(fn)  unclick(fn) click(fn)：增加一个点击时触发某函数的事件 click()：可以在其他事件中执行匹配对象的

3.8K40

jQuery 快速入门教程

(); // 选取ul li中匹配的第一个元素 $("ul li").last(); // 选取ul li中匹配的最后一个元素 $("ul li").slice(1, 4); // 选取第2 ~ 4个元素...上面我们提到的所有选取元素的方法，返回的并不是DOM元素(Element对象)，而是jQuery对象，只是其中封装了所有DOM元素。...接下来我们进行DOM操作，也应该使用jQuery对象的方法，而不是Element对象的方法。当然，jQuery对象也可以转换为DOM元素，后面我们会提到。...$("div") // 返回一个匹配所有div元素的jQuery对象 .find("ul") // 返回匹配这些div元素中的所有后代ul元素的jQuery对象 .addClass("menu") /...而attr()和prop()这两个方法，就是通用的属性获取或设置方法，不过attr()方法针对的是HTML文档节点的属性，prop()方法针对的是文档节点对应的DOM元素对象的属性。

13.6K30

jquery学习

$(":checked") 所有被选中的 input 元素 jQuery 事件 下面是 jQuery 中事件方法的一些例子： Event 函数 绑定函数至 $(document).ready(function...触发或将函数绑定到被选元素的鼠标悬停事件 jQuery 事件方法 方法 描述 bind() 向匹配元素附加一个或更多事件处理器 blur() 触发、或将函数绑定到指定元素的 blur 事件 change...事件 delegate() 向匹配元素的当前或未来的子元素附加一个或多个事件处理器 die() 移除所有通过 live() 函数添加的事件处理程序。...jQuery是继prototype之后又一个优秀的Javascript框架。其宗旨是——WRITE LESS,DO MORE!...jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。 二 什么是jQuery对象？

2.2K40

杨老师课堂之Jquery的筛选,事件,效果,Ajax,javascript跨域)

•-index：一个整数，指示元素的位置，从集合中的最后一个元素开始倒数。...事件,而不触发 和元素上的 click事件.当单击 元素时,只触发 元素上的click事件, 而不触发元素上的click事件....事件对象: 由于IE-DOM和标准DOM实现事件对象的方法各不相同,导致在不同 浏览器中获取事件对象变得比较困难.针对这个问题,jquery进行了必要的扩 展和封装,从而使得在任何浏览器中能很好的轻松的访问获取事件对象以及事...; event.stopPropagation();//停止冒泡事件 }) 当单击span元素时,只会触发span元素上的click事件,而不会触发 div元素和body元素的click事件....•由于同源策略，一般来说位于 server.example.com 的网页无法与不是 server.example.com 的服务器沟通，而 HTML 的 元素是一个例外。

8.2K20

JavaWeb（八）JQuery

是浏览器自带对象，dom 对象只能调用dom 里面的属性和方法， 不能调用jQuery 对象里面的属性和方法 jQuery对象：jquery 对象是通过jQuery 包装页面上面的元素或者dom 而产生的一个新的...事件 click() 触发、或将函数绑定到指定元素的 click 事件 dblclick() 触发、或将函数绑定到指定元素的 double click 事件 delegate() 向匹配元素的当前或未来的子元素附加一个或多个事件处理器...event.result 包含由被指定事件触发的事件处理器返回的最后一个值。 event.target 触发该事件的 DOM 元素。...click 事件时执行。....is() 根据选择器检查当前匹配元素集合，如果存在至少一个匹配元素，则返回 true。 .last() 将匹配元素集合缩减为集合中的最后一个元素。

1.8K40

jQuery基础--事件处理

2. jQuery事件机制 JavaScript中已经学习过了事件，但是jQuery对JavaScript事件进行了封装，增加并扩展了事件处理机制。...//要给div注册一个委托事件,但是最终不是由执行，而是有p执行 //第一个参数：selector:事件最终由谁来执行。...下面的所有的p标签绑定事件 }); 缺点：只能注册委托事件，因此注册时间需要记得方法太多了 on注册事件 2.2. on注册事件(重点) jQuery1.7之后，jQuery用on统一了所有事件的处理方法...() { alert("呵呵哒"); }); //给div自己执行的 $("div").on("click", function () {...事件 off方式（推荐） // 解绑匹配元素的所有事件 $(selector).off(); // 解绑匹配元素的所有click事件 $(selector).off("click"); 2.4.

2.4K30

书写高质量jQuery代码的6条经验

一、正确引用jQuery 尽量在body结束前才引入jQuery，而不是在head中。 借助第三方提供的CDN来引入jQuery，同时注意当使用第三方CDN出现问题时，要引入本地的jQuery文件。...二、优化jQuery选择器 高效正确的使用jQuery选择器是熟练使用jQuery的基础，而掌握jQuery选择器需要一定的时间积累，我们开始学习jQuery时就应该注意选择器的使用。...因为ID选择器和元素选择器是原生的JavaScript操作，而类选择器不是，大家顺便可以看下find context 区别，find() children区别。...，既可以将一个上下文参数传入jQuery，以限制它只搜索DOM中特定的一部分。...在之前的版本中 on() 就是 bind()。自从jQuery 1.7版本后，on() 附加事件处理程序的首选方法。

1.2K90

如何实现动态添加的元素添加点击事件

原生JavaScript 原生JavaScript主要有2种实现方式，第一种是在动态添加的html代码中添加oclick事件，然后传递一个唯一的参数来判断点击的是哪个，然后做相应的操作。...第二种是通过事件委托的原理进行处理，事件委托将一个 事件监听器实际上绑定到整个容器，然后每个列表项被点击就可以访问，这样效率更高。...该事件附加到staticAncestors应处理的元素的静态父级 ( )。 每次在此元素或后代元素之一上触发事件时，都会触发此 jQuery 处理程序。...然后处理程序检查触发事件的元素是否与您的选择器 ( dynamicChild)匹配。当匹配时，您的自定义处理程序函数将被执行。...尽管记住document可能不是最有效的选择。

3.8K20

JQuery第三节

jQuery1.7之后，jQuery用on统一了所有事件的处理方法。...off方式（推荐） // 解绑匹配元素的所有事件 $(selector).off(); // 解绑匹配元素的所有click事件 $(selector).off("click"); 2.4....【案例：五角星评分案例.html】 3.2. each方法 jQuery的隐式迭代会对所有的DOM对象设置相同的值，但是如果我们需要给每一个对象设置不同的值的时候，就需要自己进行迭代了。...作用：遍历jQuery对象集合，为每个匹配的元素执行一个函数 // 参数一表示当前元素在所有匹配元素中的索引号 // 参数二表示当前元素（DOM对象） $(selector).each(function...多库共存 jQuery使用$作为标示符，但是如果与其他框架中的$冲突时，jQuery可以释放$符的控制权. var c = $.noConflict();//释放$的控制权,并且把$的能力给了c

78830
点击加载更多

扫码

添加站长 进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2024 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

    领券