jQuery：已通过 .wrap() 添加到 DOM 的 jQuery 元素上的切换类？答案

【问题标题】：jQuery: Toggle class on jQuery element that has been added to the DOM via .wrap()?jQuery：已通过 .wrap() 添加到 DOM 的 jQuery 元素上的切换类？
【发布时间】：2012-06-11 20:50:47
【问题描述】：

我在处理元素的类属性时遇到问题，因为我使用 .wrap() 将它添加到 DOM。它根本不会改变属性，即使一切似乎都井井有条。

如果我使用 .wrap() 或 .wrapInner() 以外的其他东西，一切都会按预期工作。如果我将 .toggleClass() 更改为 if/else 如果仍然无法工作。

当然可以解决它，但我宁愿找到问题的根源并在此过程中学到一些东西。

这是有问题的代码：

$('.tour-category').each(function () {
    var tour_list = $(this);
    var header = tour_list.parent().find('h4');
    var link = $('<a>', {
        href: '#',
        'class': 'tour-category-toggler',
        click: function (e) {
            e.preventDefault();

            tour_list.slideToggle(200);
            link.toggleClass('close');
        }
    });

    tour_list.hide();
    header.wrap(link);
});

也许我缺少一些东西，或者这可能是 jQuery 中的错误？

【问题讨论】：

标签： javascript jquery dom-manipulation

【解决方案1】：

尝试改变

link.toggleClass('close');

进入

$(this).toggleClass('close');

【讨论】：

哦，天哪，这很快——而且效果很好。我能问一下为什么这会有所不同吗？
JavaScript 范围。 link 有点难找，如果找到了，它可能不是正确的元素。但$(this) 肯定指的是实际元素。
使用您的代码，您在循环内引用了一个变量（所有链接始终使用相同的变量），并且在该循环结束时，引用可能不正确，而我的建议是使用显式引用元素本身