Question

我在尝试点击附加到div的图片时遇到问题。

我有一个“plus_btn”，它会在点击时为div添加一个或多个“closebtn”。该部分工作正常，但单击这些关闭按钮的下一步不起作用。我还有一个名为“att-id”的属性，我试图通过点击closebtn获得，但点击不会生效。

这是我的jquery代码：

$(document).ready(function(){  
var i = 0;
$('#plus_btn').click(function(){
    $("#content").append('<img id="closebtn" class="imgbtn" att-id="'+i+'" width="20" height="20" src="manage/images/closebtn.png">');              
    i++;
});   
$(".imgbtn").click(function(){
    alert('gggg');          
}); 
});

这是我的HTML代码：

    <img id="plus_btn" src="images/plus_btn.png" width="15" height="15" />
    <div id="content" name="content">

任何帮助将不胜感激。

Answer 1

jQuery默认不监听动态插入的内容，你需要像这样使用ON方法：

$('#parent_element').on('click', '.class_of_new_dynamic_element_here', function(){ 
   // code here 
}

您的工作Fiddle here

这是因为jQuery知道随之加载的DOM，之后附加的任何元素都需要指定给jQuery。

希望这有帮助

Answer 2

使用.on()代替点击：

$(".imgbtn").on('click',function(){
    alert('gggg');          
});

id属性也是唯一的，因此每次点击按钮时都无法添加#closebtn。我建议也使用课程。

使用jquery附加到div的图像不可单击

2 个答案: