-1

我一直在做一个项目，我必须使用一些 jQuery 来更改特定 div 的类，然后我必须针对该 div 使用另一块 jQuery 执行特定操作。我的问题是，当我的 div 类已更改时，我无法使用新类来定位它。

HTML 代码 -

<div class="box"></div>

<h1 class="change-class">Change class name</h1>

<br> <a class="hide-new">Hide new named</a>

jQuery 代码 -

$(".change-class").click(function () {
    $(".box").removeClass('box').addClass('test box');
});

$(".test").click(function () {
    $('.test').toggle(500);
});

我在 JSFiddle 中创建了一个示例项目 - http://jsfiddle.net/KT9kn/

任何帮助，将不胜感激。

杰米

4

4 回答 4

2

在该类的元素出现之前，您将click处理程序绑定到该类。test用于实时绑定使用

$(document).on('click', '.test', function() {
    ...
});
于 2013-07-30T22:11:27.363 回答
1

您想使用延迟事件。改变：

$(".test").click(function () {
    $('.test').toggle(500);
});

至：

$("ELEMENT THAT CONTAINS YOUR BOX").on('click', '.test', function () {
    $(this).toggle(500);
});
于 2013-07-30T22:07:51.447 回答
1

JQuery 事件绑定仅适用于当前找到的现有元素。当您将 click 事件绑定到.testJQuery 时，找不到要绑定的元素。将您的代码更改为：

$(".change-class").click(function () {
    $(".box").removeClass('box').addClass('test box');
    $(".test").click(function () {
        $('.test').toggle(500); 
    });
});

或者，请参阅 SO 问题 Event binding on dynamic created elements？用于动态添加事件。

于 2013-07-30T22:08:53.747 回答
1 
$(".change-class").click(function () {
    var changed = $(".box").removeClass('box').addClass('test');
    changed.click(function() {
        $(this).toggle(500);
    });
});

在本地使用变量，您可以存储 jquery 对象，然后在执行更改后使用该变量附加单击事件。

您也可以绕过变量并这样做：

$(".change-class").click(function () {
    $(".box").removeClass('box').addClass('test').click(function() {
        $(this).toggle(500);
    });
});

但它变得不那么可读了。

于 2013-07-30T22:09:59.243 回答