2

我是 jQuery 的新手。我认为jQuery可以操作代码添加的元素是合理的,但我发现它现在不能。

$(function(){
    $("#addVideo").click(function(){
         $("#publisher").append("<div id='choseType'><input type='button' value='video'> <input value='music' type='button'> <input type='button' value='X'></div>");
    })      
    $("#choseType input:eq(0)").click(function(){
     $(this).addClass("selected");
    })
})

是 jquery 的限制还是我的代码的错?似乎如果我将第二个click()函数放入第一个函数中它会正确运行,但它只会运行一次(如果我删除附加#choseType并再次附加它,第二次点击将不起作用。)。那么我该如何操作添加的代码元素?谢谢!

4

2 回答 2

4

将事件委托给非动态元素:

$(document).on('click', "#choseType input:eq(0)", function(){
    $(this).addClass("selected");
});

ID 是独一无二的!

于 2012-04-29T23:56:22.043 回答
2
$(function(){
    $("#addVideo").click(function(){

        //create new content, and append to publisher
        //also, reference the new content
        var newContent = $("<div><input type='button' value='video'> <input value='music' type='button'> <input type='button' value='X'></div>").appendTo('#publisher');

        //then add a handler to input in the context of the new content
        $("input:eq(0)", newContent).click(function(){
            $(this).addClass("selected");
        });
    })    
})
于 2012-04-29T23:56:31.117 回答