关闭后，jQuery 手风琴仍处于选中状态

jquery accordion remains selected after closing

本文关键字：于选中 状态 手风琴 jQuery      更新时间：2023-09-26

我有一个jQuery可排序的手风琴。当我将鼠标悬停在每个手风琴标题上时，它们都相应地切换到突出显示/选定的颜色状态。当我单击标题以打开手风琴的该部分，然后再次单击它以关闭手风琴的该部分时，突出显示/选定的颜色状态仍然存在。

因此，如果我手风琴有

10个部分，那么我打开和关闭其中的3个部分，这3个部分的颜色与手风琴的其余部分不同.这提供了一个糟糕的 UI。有人知道为什么会发生这种情况以及如何解决它吗？

编辑：

很抱歉没有提供示例开始，我正在 NDA 下工作，所以我不能直接提供它们。不过，我整理了一个可共享的例子来说明正在发生的事情。

你可以在这里看到它发生：http://inadaydevelopment.com/StackOverflow/AccordionStateProblem/jqueryexample.html

如果将鼠标悬停在它们上，它们将变为橙色（正确）。如果您单击一个将其打开，它将保持橙色（正确）。如果您关闭它并且不再悬停，它仍然保持橙色，而不是恢复为蓝色（错误）。

以下内容将清除导致问题的"ui-state-focus"类：

$('.ui-accordion .group > h3').mouseleave(function(){
    $(this).removeClass('ui-state-focus')
})

这是在浏览器控制台中针对演示进行测试的。

编辑：选择器可以简单地缩小到：

$('.ui-accordion-header')
相关文章：