jquery - 向 div 添加一个类，然后使用该类添加 onclick 事件

Question

我有一个起初不可点击的元素，但我想让点击另一个 div 使其可点击。

我所做的是

$("#div_1").addClass("selected");

$(".selected").click(function() {
    $("#block").animate({
        width: "70%",
        opacity: 0.4,
        marginLeft: "0.6in",
        fontSize: "3em",
        borderWidth: "10px"
    }, 1500);
});​

但这似乎不起作用，我不确定这有什么问题，也许有更好的方法来做到这一点？

Answer 1

Try something like this:

$("#div_1").addClass("selected");

$("#div_1").click(function() {
    if($(this).hasClass('.selected') {
    $("#block").animate({
        width: "70%",
        opacity: 0.4,
        marginLeft: "0.6in",
        fontSize: "3em",
        borderWidth: "10px"
    }, 1500);
    }
});​

同样出于可用性目的，当您添加可点击功能时，请使用它使其对用户显示可点击：

$("#div_1").addClass("selected").css('cursor', 'pointer');

Answer 2

您需要委托此类情况...尝试使用.on()并将事件附加到静态父级..

因为当添加类时，事件已经与 DOM 加载时相关联。所以委派它可以解决问题。

$("#div_1").addClass("selected");

$('body').on("click", ".selected", function() {
     // Your code here
});​