jquery - 无法关闭移动设备上的下拉菜单
问题描述
我希望在您单击下拉菜单中的项目时关闭菜单。此时,菜单仅在您单击菜单按钮时关闭。
链接到网站 >>> http://www.glassmania.pl/PROA5/index.html
$(document).ready(function() {
$.fn.menumaker = function(options) {
var cssmenu = $(this), settings = $.extend({
title: "Menu",
format: "dropdown",
sticky: false
}, options);
return this.each(function() {
cssmenu.prepend('<div id="menu-button"><span></span><span></span><span></span>' + settings.title + '</div>');
$(this).find("#menu-button").on('click', function(){
$(this).toggleClass('menu-opened');
var mainmenu = $(this).next('ul');
if (mainmenu.hasClass('open')) {
mainmenu.slideUp().removeClass('open');
}
else {
mainmenu.slideDown().addClass('open');
if (settings.format === "dropdown") {
mainmenu.find('ul').slideDown();
}
}
});
cssmenu.find('li ul').parent().addClass('has-sub');
multiTg = function() {
cssmenu.find(".has-sub").prepend('<span class="submenu-button"></span>');
cssmenu.find('.submenu-button').on('click', function() {
$(this).toggleClass('submenu-opened');
if ($(this).siblings('ul').hasClass('open')) {
$(this).siblings('ul').removeClass('open').slideUp();
}
else {
$(this).siblings('ul').addClass('open').slideDown();
}
});
};
if (settings.format === 'multitoggle') multiTg();
else cssmenu.addClass('dropdown');
});
};
$(".navy").menumaker({
title: "Navigation",
format: "multitoggle"
});
$('#menu-button').click(function(){
$(this).toggleClass('open');
});
});
解决方案
没有工作示例很难提供帮助,但我会尽力提供帮助。
我认为这是你需要的:
$('.page-scroll').click(function(){
$(this).parents('ul').removeClass('open');
});
page-scroll 类是您的菜单项,当用户单击它时,我们会从父 ul 元素中删除 open 类。
推荐阅读
- html - 如何使用表情符号选择器以角度制作输入字段或文本区域?
- marklogic - 摄取时将输入文件名传递到 MLCP 转换模块
- session - systemd 服务无法连接到会话 d-bus
- android - 来自我在 kotlin 的 android 项目中的 AWS S3 中的 Putobject
- assembly - 汇编:有符号的数字运算与无符号的数字运算不同吗?
- dialogflow-es - DialogFlow 未检测到“今天”和“昨天”的日期周期
- php - 从日期中减去一个值并在 PHP 中返回新日期
- css - 具有不同值的触控笔循环
- c++ - 是否允许递归初始化数组?
- xamarin - Xamarin 与 VS 2017 - 无法运行模拟器