Question

我发现为移动/小屏幕设备创建一个单独的菜单非常复杂，因此我决定使用主菜单，但是我的目标是默认显示所有链接（加载页面时），实际上是用户需要单击一个小图标来显示下拉链接，这是非常流行的做法，大多数用户对此感到满意，但是我的客户坚持不显示任何内容而显示所有链接。

我设法隐藏了该图标，但由于无法再显示这些链接而被卡住，默认情况下是否有办法激活该onClick功能？还是禁用移动设备上的下拉列表辅助列表？

下面的代码是导航：

NavigationView.prototype.initialize = function() {
  this.$el.on('click', (function(_this) {
    return function(e) {
      if (!$(e.target).closest('.navigation').length) {
        return _this.$('.navigation .open').removeClass('open');
      }
    };
  })(this));
  this.$el.on('focus', '.header-navigation-link.primary-link', (function(_this) {
    return function() {
      var $menuWrapper;
      $menuWrapper = $(_this.$el.find('.has-dropdown.open'));
      if ($menuWrapper.length) {
        return $menuWrapper.toggleClass('open', false);
      }
    };
  })(this));
  return this.$el.on('focus', '[data-is-dropdown] .secondary-link', (function(_this) {
    return function(event) {
      var $target;
      $target = $(event.currentTarget);
      return $target.parents('.has-dropdown').toggleClass('open', true);
    };
  })(this));
};

NavigationView.prototype.toggleNavigation = function(e) {
  var $target;
  $target = $(e.target);
  if ($target.parents().hasClass('has-dropdown')) {
    e.preventDefault();
    return $target.parent().toggleClass('open');
  }
};

return NavigationView;

我要更改的是ToggleClass；默认情况下处于活动状态，因此无需单击图标即可显示辅助列表

Answer 1

我相信这是您要查找的语法：

this.$el.on('click', myFunction); //runs myFunction onclick

function myFunction() {
  //display dropdown code here
}

myFunction(); //runs myFunction onload

默认情况下，onClick功能处于活动状态

1 个答案: