JQuery切换按钮和手风琴问题

时间:2010-08-16 19:11:10

标签: jquery accordion toggle jquery-ui-accordion

我有一个“菜单”btn应该滑动打开一个带有“手风琴”菜单的div。

当我为包含手风琴的div添加值hide()(在JS中)或“hidden”(在CSS中)时,手风琴会停止正常工作。当您使用菜单btn的手风琴打开div后,单击手风琴部分时,它不会查看其中的所有内容。

我用手风琴隐藏div的原因是它应该关闭,直到你按下菜单btn。

手风琴代码:

<script type="text/javascript">
    $(function() {
    //  $('.effect').hide();
        $("#moduleMenu1, #moduleMenu2").accordion({collapsible: true, active: false});
    });
</script>

菜单代码btn:

<script type="text/javascript">
    $(function() {
    $(".moduleMenuBtn").click(function() {
        var effect = $('slide').val();
        var options = {};
        $(this).parent().next(".effect").toggle(effect,options,500);
        return false;
    });
});
</script>

请注意,菜单btn的脚本没有“滑动”用手风琴打开div,它只是弹出而没有“幻灯片”动画?

HTML

<div class="effect">
                    <div id="moduleMenu1">
                        <h3><a href="#">Section1</a></h3>
                        <div>
                          <p>Some Content</p>
                        </div>
                    </div>
                  </div>

1 个答案:

答案 0 :(得分:0)

你的第一部分是正确的

$("#moduleMenu1, #moduleMenu2").accordion({
      collapsible: true, active: false
});

如果你运行它只是显示所有允许关闭的部分并且没有打开它们。

问题是你在菜单按钮上触发click事件,打开#moduleMenu1打开的内容。

另外

$('.effect').hide();

实际上隐藏了整个菜单和内容部分,而不是您想要的内容。