jQuery select元素，动态添加类

Question

我有一个按钮，单击该按钮会将一个类添加到另一个按钮。然后，我有一个为该按钮设置的选择器，但仅在该类存在时。如果未单击第一个按钮，则第二个按钮的选择器应无效。但是，即使我点击了第一个按钮，它仍然无法正常工作。

我认为.live()曾用过这个，后来（一旦live被弃用）.on()会覆盖这个。

任何人都知道我需要做什么？

http://jsfiddle.net/p39gZ/1/

的jQuery

$('#button1').click(function(){
    $('#button2').addClass('active');
});

$('#button2.active').on('click', function(){
    alert("");
});

HTML

<input type="button" id="button1" value="Add Class" />
<input type="button" id="button2" value="Button with event listener" />

Answer 1

您需要将click事件绑定到加载DOM时存在的容器元素，然后使用.on（）方法将活动类作为参数传递。 下面的例子是一个id为“container”的div包装两个按钮。

 $('#container').on('click', '.active', function() {
      alert('clicked');
 });

小提琴： http://jsfiddle.net/p39gZ/2/

Answer 2

您也可以使用.hasClass()

尝试此操作

$('#button2').on('click', function () {
    if ($(this).hasClass('active')) {
        alert("active");
    }
});

JSFiddle

Answer 3

试试这个

$('#button2').on('click', function(){
    if($(this).attr('class') == "active")
        alert("Active Clicked");
});

请参阅此DEMO