1

请看下面的代码和小提琴。

代码

$("#enable").click(function(e) {
    if (!$("#enable").data('isOn')) {
        $("#holder").find('.clickable').each(function(d) {
            $(this).css('border', '1px solid red');
            $(this).addClass('clickEnabled');
        });
        $("#enable").data('isOn', true);
    } else {
        $("#holder").find('.clickable').each(function(d) {
            $(this).css('border', '');
            $(this).removeClass('clickEnabled');
        });
        $("#enable").data('isOn', false);

    }

});

$(".clickEnabled").click(function(e) {
    alert('clicked');
}); 

小提琴:http: //jsfiddle.net/qAuwt/

我基本上是在按下按钮时尝试在元素上切换“clickEnabled”类。切换正在工作,因为边框正在更改,但是 clickEnabled 类没有响应单击事件

4

3 回答 3

2

.clickEnabled设置事件处理程序时没有元素。但是,您仍然可以捕获 click 事件:

$(document).on("click", ".clickEnabled", function(){
    alert("Hello, world!");
});​
于 2012-07-25T17:11:30.767 回答
1

改变:

$(".clickEnabled").click(function (e) {
    alert('clicked');   
});

至:

$(".clickable").click(function (e) {
    if ( $(this).hasClass("clickEnabled") )
    {
        alert('clicked');   
    }
});

正如@araxanas 提到的,.clickEnabled加载时不存在。所以我将选择器切换到.clickable,这样做。但是,您只想在它们启用时处理点击。这就是我添加条件的原因。仅当单击的元素具有clickEnabled类时才会发出警报。

此外,将 css 从 javascript 中移出可能会有所帮助,这样您就可以直观地看到该类是否存在,请参阅我更新的fiddle

于 2012-07-25T17:15:30.830 回答
-1

问题是当页面加载时,click 事件处理程序绑定到任何元素(因为没有类为“clickEnabled”的元素)。

解决方法是将 .click() 方法更改为 .live() 方法:

$(".clickEnabled").live('click', function (e) {
    alert('clicked');
});
于 2012-07-25T17:17:43.060 回答