JQUERY的事件委派问题

Event delegation issue with JQUERY

本文关键字：问题 委派 事件 JQUERY      更新时间：2024-05-24

我是Jquery的新手，我正在努力了解事件委派是如何工作的。我正在尝试这个：

 $("#32298").on( 'click',function() { // event delegation
        alert("df");
        var imgs = document.getElementById("32298")[0].src;
        alert(imgs);
  });

当我点击这个Id的图像时，我会收到第一个警报，但第二个警报不起作用。

我在这里做错了什么？非常感谢。

如果要执行事件委派，那么事件处理程序函数的第二个参数需要是一个选择器，以匹配与要单击的元素匹配的元素。

$(document.body).on('click', "#32290", function(event) {

代码的问题与事件委派无关。getElementById返回单个元素（id在文档中必须是唯一的），而不是HTML集合。（与使用复数元素的getElementsByTagName和getElementsByClassName相比。）它不会具有0属性。

var imgs = document.getElementById("32298").src;

由于您使用的是jQuery，您可以简单地使用$(this)构造函数，而不是document.getElementById():

$("#32298").on( 'click',function() { 
    alert("df");
    var imgs = $(this).attr('src');
    alert(imgs);
});

顺便说一句，这不是事件委派，它只是一个绑定到元素的事件。

如果必须使用vanillaJS来获取src属性，则不需要向getElementById()的返回值传递索引，因为此函数返回的是DOMObject，而不是数组。更新如下：

$("#32298").on( 'click',function() {
    alert("df");
    var imgs = document.getElementById("32298").src;
    alert(imgs);
});

同样值得注意的是，ID应该是唯一的，因此#32298应该引用DOM中的单个元素。我不知道这是否是拼写错误，但似乎有多个元素具有相同的ID（因为您使用了变量名imgs，即复数）。

你可以试试这个

$("#32298").click( function() {
  alert("df");
var imgs = $(this).attr('src');
alert(imgs);
});
相关文章：