Question

Hello ive按照此webspage Add a Blogger-like collapsible archive block to your Drupal 7 site的说明操作，并对自己感到惊讶，以至于一切似乎都“有点”有效。正如您在THIS PAGE右侧的“可折叠区块”中所看到的那样，在查看其他月份时，该区块似乎不想保持打开状态。我不认为这是预期的行为。

jQuery(document).ready(function($) { 
    // init: collapse all groups except for the first one
    $(".view-collapsible-archive ul").each(function(i) {
        if (i==0) {
            $(this).siblings("h3").children(".collapse-icon").text("▼");
        } else {
            $(this).hide();
        }
    });

    // click event: toggle visibility of group clicked (and update icon)
    $(".view-collapsible-archive h3").click(function() {

        var icon = $(this).children(".collapse-icon");

        $(this).siblings("ul").slideToggle(function() {
            (icon.text()=="▼") ? icon.text("►") : icon.text("▼");
        });
    });
});

有人可以向我提出任何建议，点击一个月后打开菜单块并关闭其他'月'？

感谢

Answer 1

这是因为这一行：

$(this).siblings("ul").slideToggle

它说：＆＃34;使用幻灯片动画切换所有ul元素的状态＆＃34;

如果隐藏它以显示它，则需要将其更改为slideDown;当隐藏它时，您需要将其更改为幻灯片。

我会提供一个代码示例，但我现在只用一个拇指在iPhone上打字。

Answer 2

问题是你已经在文件http://netmagpie.com/sites/all/themes/feverultra/js/feverultra.js中添加了你的代码，然后通过添加你的文件，你绑定了两次事件并且函数切换两次，所以元素打开和关闭

如果您只想打开一个月，则需要关闭任何打开的月份，然后再打开被点击的月份，例如：

jQuery(document).ready(function($) { 
    // init: collapse all groups except for the first one
    $(".view-collapsible-archive ul").each(function(i) {
        if (i==0) {
            $(this).siblings("h3").find(".collapse-icon").text("▼");
        } else {
            $(this).hide();
        }
    });

    // click event: toggle visibility of group clicked (and update icon)
    $(".view-collapsible-archive h3").click(function() {

       $('.view-collapsible-archive ul:visible').not($(this).next('ul')).slideUp();

        var icon = $(this).find(".collapse-icon");
        $(this).siblings("ul").slideToggle(function() {
            (icon.text()=="▼") ? icon.text("►") : icon.text("▼");
        });
    });
});

可折叠菜单不能保持打开状态

2 个答案: