Question

我遇到了一个问题，我需要将点击事件应用于动态创建的img标记，

（当用户上传文件时，图像X会添加到锚标记中的页面中，以允许用户以友好的方式删除文件上传）

我有这个：

$('#ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap_list').find('img').click(function()
{
    alert("teststs");
});

我希望找到任何img元素作为ID为#ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap_list的元素的子孙，并将click事件应用于它，但不会出现警告，

非常感谢提前

编辑：这是我试图遍历以获取img标签的html

<div id="ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap_list" class="MultiFile-list"> 
<div class="MultiFile-label"> 
<a class="MultiFile-remove" href="#ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap"> 
<img width="12px" src="App_Theme/Images/CloseImage.jpg">

Answer 1

您应该使用on()，因为这是一种更好的方法。您可以在DOMRead函数中绑定事件一次，它将应用于所有插入的图像：

$(function() {  
    $(document).on('click', '#ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap_list img', function() {  
        alert("teststs");
    });
});

这里不是我们将选择器作为事件绑定的第二个参数传递。来自jQuery Docs：

选择器
类型：字符串
用于过滤后代的选择器字符串触发事件的选定元素。如果选择器为null 或者省略，事件总是在到达所选事件时触发元件。

您当然应该注意，这需要jQuery＆gt; = 1.7。

Answer 2

为什么不尝试事件委派：使用.on()，因为您正在处理动态生成的元素：

$(function() {  
    $(document).on('click', '#ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap_list img', function() {  
        alert("teststs");
    });
});

Answer 3

请试用此代码

$(function() {  
    $(document).on('click', '#ctl00_ContentPlaceHolder1_DocumentUpload1_file_upload2_wrap_list img', function() {  
        alert("teststs");
    });
});

'find'img标签并将click事件应用于它

3 个答案: