jQuery - 切换父元素的类？

Question

我有几个列表元素，就像这样：

<li class="item">
    <a class="toggle"><h4>ämne<small>2010-04-17 kl 12:54 by <u>nike1</u></small></h4></a>
    <div class="meddel">
        <span>
            <img style="max-width: 70%; min-height: 70%;" src="profile-images/nike1.jpg" alt="" />
            <a href="account.php?usr=47">nike1</a>
        </span>

        <p>text</p>
        <span style="clear: both; display: block;"></span>
    </div>
</li>

<li class="item odd">
    <a class="toggle"><h4>test<small>2010-04-17 kl 15:01 by <u>nike1</u></small></h4></a>
    <div class="meddel">
        <span>
            <img style="max-width: 70%; min-height: 70%;" src="profile-images/nike1.jpg" alt="" />
            <a href="account.php?usr=47">nike1</a>
        </span>

        <p>test meddelande :) [a]http://youtube.com[/a]</p>
        <span style="clear: both; display: block;"></span>
    </div>
</li>

我正在尝试弄清楚如何使得当你点击一个带有.toggle类的链接时，它的父元素（li元素）将切换到.current类。

我不确定以下代码是否正确，但它没有起作用。

$(this).parent('.item').toggleClass('.current', addOrRemove);

即使我删除了“（'.item'）”，似乎也没有任何区别。

那么，有什么想法吗？

提前致谢。

- qwerty

Answer 1

toggleClass接受一个类名，而不是选择器。因此，您不应该包含.。
将其更改为toggleClass('current')（不带.）。

此外，通过调用closest而不是parent，您可以使代码更加健壮。 closest将搜索与选择器匹配的最内部父元素，因此如果链接嵌套在.item中，则它将继续工作。

- SLaks

---

谢谢，但似乎还是不起作用 :/$('.pmlist ul li .toggle').click(function() { $(this).next("div").toggle(250); $(this).closest('item').toggleClass('current'); }); 之前的toggle函数可以触发，只是toggleClass函数由于某种原因无法正常工作。 - qwerty

有点糟糕，你不能在评论中发布代码块，甚至不能添加新行 :S 希望你还是能够阅读它 :P - qwerty

你能在Firebug中看到这个类吗？ - SLaks

尝试使用 console.log($(this).parent('.item')) 来检查选择器是否匹配。 - SLaks

@Nike - .closest()使用选择器，因此在.item中需要。，因此您的代码应为：$（'.pmlist ul li .toggle'）.click（function（）{ $（this）.next（“div”）.toggle（250）; $（this）.closest（'.item'）.toggleClass（'current'）; }）; - Nick Craver