Question

我正在使用＆＃34; VMenu＆＃34;作为一个jQuery插件，在HTML网站上显示一个巨大的手风琴，因为它支持一个只有<u>和<li>标签的非常简单的结构。

现在，我想用一个事件/按钮/...

关闭所有打开的手风琴标签

插件创建者没有回答问题所以我需要你的帮助。

我将整个代码放在jsfiddle中，但它不起作用：https://jsfiddle.net/ekbLLcLd/3/

(function($) {
  $.fn.vmenuModule = function(option) {
    var obj,
      item;
    var options = $.extend({
        Speed: 220,
        autostart: true,
        autohide: 1
      },
      option);
    obj = $(this);

    item = obj.find("ul").parent("li").children("a");
    item.attr("data-option", "off");

    item.unbind('click').on("click", function() {
      var a = $(this);
      if (options.autohide) {
        a.parent().parent().find("a[data-option='on']").parent("li").children("ul").slideUp(options.Speed / 1.2,
          function() {
            $(this).parent("li").children("a").attr("data-option", "off");
          })
      }
      if (a.attr("data-option") == "off") {
        a.parent("li").children("ul").slideDown(options.Speed,
          function() {
            a.attr("data-option", "on");
          });
      }
      if (a.attr("data-option") == "on") {
        a.attr("data-option", "off");
        a.parent("li").children("ul").slideUp(options.Speed)
      }
    });
    if (options.autostart) {
      obj.find("a").each(function() {

        $(this).parent("li").parent("ul").slideDown(options.Speed,
          function() {
            $(this).parent("li").children("a").attr("data-option", "on");
          })
      })
    }

  }
})(window.jQuery || window.Zepto);

我认为这是一项简单的任务，但我不知道该怎么做。

Answer 1

添加此功能并在任何按钮点击时触发：

function closeAll()
{
    // obj will be your div(wrapper) within your all accordion is exist;
    var item2 = $(".u-vmenu").find("ul").parent("li").children("a");
    item2.attr("data-option", "off");

    item2.each(function(){
        $(this).attr("data-option", "off");
        $(this).parent("li").children("ul").slideUp(200);
    }); 
}

此功能将关闭所有已打开的手风琴。

关闭活动中的所有手风琴选项卡

1 个答案: