1

当我尝试使用 jQuerynext()方法时，它不适用于live().

首先，这是我的代码：

$(".toggle_button").live('click', function() {
    $(this).html($(this).html() == '-' ? '+' : '-');
    $(this).next(".info_section").toggle(400);
});

这是HTML

<div class='section_toggle_container'>
    <div class='toggle_button'>-</div>
    <strong>Driver Information:</strong>
</div>
<div class='info_section'>
    info here
</div>

问题是否可能在于.toggle_button嵌套的事实，使.info_section无法访问？

第二行效果很好，因为它正在修改给定live()事件的元素。然而，第三行是问题所在。这是因为它使用next().

谁能帮我解决我的next()问题？

4

2 回答 2

3

查看 HTML 不应该是您的声明：

$(this).next(".info_section").toggle(400);

是：

$(this).parent().next(".info_section").toggle(400);
于 2011-01-17T23:43:30.863 回答
1

虽然您有有效的答案，但我想留下一个关于您切换-and的+建议，我建议使用text()而不是 HTML，并使用固有的text(for text(), htmlfor html())：

$(".toggle_button").live('click', function() {
    $(this).text(function(index,text) {
        return text == '-' ? '+' : '-';
    });
    $(this).parent().next(".info_section").toggle(400);
});

而且，此外，我建议缓存您的$(this)，如果您不止一次调用它，那么值得使用缓存来防止随后重新创建它，从而导致：

$(".toggle_button").live('click', function() {
    var $this = $(this);
    $this.text(function(index,text) {
        return text == '-' ? '+' : '-';
    });
    $this.parent().next(".info_section").toggle(400);
});

当然，如果您使用的 jQuery 版本大于或包括 1.7，那么您应该使用该on()方法，而不是（自 jQuery 1.7 起） deprecated live()，这将给出：

$(".toggle_button").on('click', function() {
    var $this = $(this);
    $this.text(function(index,text) {
        return text == '-' ? '+' : '-';
    });
    $this.parent().next(".info_section").toggle(400);
});

不过，这实际上只是建议，不幸的是，它作为一个答案发布，以防止将难以理解的代码粘贴到评论中。

参考：

于 2012-07-31T16:54:35.137 回答