Foundation 6禁用手风琴项目

时间:2016-12-16 01:05:10

标签: javascript zurb-foundation

我想禁用Foundation 6手风琴小部件中的一个项目。这意味着如果它被点击/切换,其内容不应该下拉,并且标题元素不应该以任何方式改变(例如小加号图标改为减号图标)。我已经为这些问题找到了几个答案,但没有任何效果100%。

HTML

<ul class="accordion" data-accordion data-allow-all-closed="true">
    <li class="accordion-item disabled">
        <a href="#" class="accordion-title">My Title</a>
        <div class="accordion-content" data-tab-content>
            <p>Hello, this is some content.</p>
        </div>
    </li>
    <!--more items-->
</ul>

的JavaScript

$('.accordion').on('click', 'li', function (e) {
    if ($(this).hasClass('disabled')) {
        $(this).removeClass('is-active');
        $(this).find('div.accordion-content').hide();
    }
});

上面的代码部分有效。如果点击了手风琴项目,则没有任何反应。大!但如果双击,则下拉列表打开。不好(如果再次点击它甚至会关闭)。我尝试将dblclick事件添加到绑定中,但它没有任何效果。如果我删除以下代码行;

$(this).removeClass('is-active');

双击不再打开该项目。但是现在aria属性都发生了变化,小标题图标从加号变为负号,表明手风琴项目现在已经打开。这不是一个可以接受的解决方案。

我已经尝试过使用手风琴API,但似乎没有什么能阻止它响应双击事件。有趣的是,在任何触发此事件的地方绝对没有双击事件。另外,如果我添加一个事件侦听器断点,然后在中断后继续,则该项自身行为,并且不再在双击时打开。这是怎么回事?

0 个答案:

没有答案