Question

手风琴部分打开时如何有条件地处理。我要问的是这个（伪代码）：

if (this-accordion-section-open){
   do something
}
else {
   do something else
}

我正在寻找类似的东西：isvisible。

感谢您的帮助。

Answer 1

以下代码返回活动面板，

var active = $( ".selector" ).accordion( "option", "active" );

Answer 2

来自demo site，我注意到打开的部分有一个ui-state-active课程。因此，您可以使用jQuery.hasClass代码...

Answer 3

手风琴的基本HTML结构是：

<h3>
    <a>...</a>
</h3>

我过去的做法是将标记分配给标记：

<h3>
    <a class="my_accordion">...</a>
</h3>

jQuery UI根据其状态为标记分配不同的类。

if($('.my_accordion').parent('h3').hasClass('ui-state-active')) {
    // accordion is open
}
else {
    // accordion is closed
}

Answer 4

尽管Accordion控件是一个jquery UI组件，但您不必使用jquery来验证该控件是否处于展开状态。这样简单的检查就可以了：

/**
* returns true if the elt is a header tag of an accordion control
* that is in the active state (expanded)
* @param {HTMLElement} elt - one of the header elements of the accordion div
*/
function isActive(elt){
    elt.classList.contains('ui-state-active');
}

如果您想使用jquery，可以执行以下操作：

$('query-string').hasClass('ui-state-active');

Answer 5

激活当前点击链接的解决方案：

HTML代码

<div id="accordion">

    <div>
        <h2><a href="#services">Services</a></h2>
        <p>More information about all of these services</p>
    </div>

    <div>
        <h2><a href="#about">About</a></h2>
        <p>About us</p>
    </div>

</div>

Jquery代码：

<script type="text/javascript">
$(function(){
$("#accordion").accordion({ header: "h2", navigation: true });
});
</script>

检测jquery-ui手风琴开/关状态

5 个答案: