1

所以我试图创建一个动态图片库。每个创建的图像都会在顶部有一个 div 供用户点击。我无法将点击事件绑定到 div

编码

$(document).ready(function()
{
    if()
    {

    }
    else
    {
        var divImgContainer =  '<div id="imgContainer">';
        var divInfo         = '<div id="info">';
        var divDetails      = '<div id="details">';
        var divImage        = '<div id="image">';
        var divVote         = '<div id ="click">';
        for(i=0; i<$ImageArray.length; i++)
        {
             document.getElementById("container").innerHTML += divImgContainer+divInfo+divDetails+'Caption</div>'+divVote+'</div></div>'+divImage+'<a href="img/'+$ImageArray[i].link +'"><img src="'+$ImageArray[i].thumb+'" /></a></div></div>';
         }
        $('#click').click(function()
        {
            alert("click");
        });
    }
});

谷歌搜索给出了两个流行的答案,一个是$('#click').click(function() ,另一个是$('#click').live(click,function() 两者都不起作用。

是否有任何特定方法可以为动态生成的 div 绑定点击事件?

4

3 回答 3

2

首先,不要创建多个具有相同 ID 的 div

假设元素 id 'click' 具有类 'vote' 并且您想单击任何具有类 'vote' 的 div,试试这个:

$('#container').on('click', '.vote', function(e){
    alert("click");
});
于 2013-02-01T12:26:54.847 回答
0

首先,该.live()方法在 jQuery 1.7 中被弃用并在 jQuery 1.9 中被删除,你不应该使用它。

您正在使用 JavaScript 创建元素,但您是在页面加载时执行它,并且在您(尝试)绑定事件处理程序之前,所以这不应该是一个问题。

但是,问题可能是您正在这样做:

... + divVote+'</div>...

这会打开<div id="click">元素,然后立即结束它,因此它似乎没有任何内容。如果它没有内容,那么您将很难真正点击它。

于 2013-02-01T12:14:17.290 回答
0

$('#click').click(function(){
     alert("click");
});

之外

$(document).ready(function(){   });

如果它不起作用,然后尝试

$('#click').live(click,function()

它可能会帮助你

于 2013-02-01T12:15:19.597 回答