javascript - 我可以为基于 HTML 类的菜单效果编写 if/else 条件吗？

Question

我正在使用 megamneu 和以下 jQuery。当前的菜单效果是“悬停幻灯片”，我想在找到手机或平板电脑时将悬停幻灯片效果更改为单击幻灯片。我的 HTML 头中有 html.mobile 和 html.tablet。我如何根据我的 html 类编写该条件

我想要一个条件，说明如果 html.mobile 或 html.tablet ，则菜单效果为“clide-slide”，否则菜单效果为“hover-slide”

$(document).ready(function($){
    $('.megamenu').megaMenuReloaded({
        menu_speed_show : 300, // Time (in milliseconds) to show a drop down
        menu_speed_hide : 0, // Time (in milliseconds) to hide a drop down
        menu_speed_delay : 100, // Time (in milliseconds) before showing a drop down
        menu_effect : 'hover_slide', // Drop down effect, choose between 'hover_fade', 'hover_slide', 'click_fade', 'click_slide', 'open_close_fade', 'open_close_slide'
        menu_easing : 'jswing', // Easing Effect : 'easeInQuad', 'easeInElastic', etc.
        menu_click_outside : 1, // Clicks outside the drop down close it (1 = true, 0 = false)
        menu_show_onload : 0, // Drop down to show on page load (type the number of the drop down, 0 for none)
        menubar_trigger : 0, // Show the menu trigger (button to show / hide the menu bar), only for the fixed version of the menu (1 = show, 0 = hide)
        menubar_hide : 0, // Hides the menu bar on load (1 = hide, 0 = show)
        menu_responsive : 1, // Enables mobile-specific script
        menu_carousel : 0, // Enable / disable carousel
        menu_carousel_groups : 0 // Number of groups of elements in the carousel
    });
});

Answer 1

使用条件(又名“三元”)运算符。

$(document).ready(function($){
    $('.megamenu').megaMenuReloaded({
        menu_speed_show : 300, // Time (in milliseconds) to show a drop down
        menu_speed_hide : 0, // Time (in milliseconds) to hide a drop down
        menu_speed_delay : 100, // Time (in milliseconds) before showing a drop down
        menu_effect : $("html.mobile, html.tablet").length ? 'click_slide' : 'hover_slide', // Drop down effect, choose between 'hover_fade', 'hover_slide', 'click_fade', 'click_slide', 'open_close_fade', 'open_close_slide'
        menu_easing : 'jswing', // Easing Effect : 'easeInQuad', 'easeInElastic', etc.
        menu_click_outside : 1, // Clicks outside the drop down close it (1 = true, 0 = false)
        menu_show_onload : 0, // Drop down to show on page load (type the number of the drop down, 0 for none)
        menubar_trigger : 0, // Show the menu trigger (button to show / hide the menu bar), only for the fixed version of the menu (1 = show, 0 = hide)
        menubar_hide : 0, // Hides the menu bar on load (1 = hide, 0 = show)
        menu_responsive : 1, // Enables mobile-specific script
        menu_carousel : 0, // Enable / disable carousel
        menu_carousel_groups : 0 // Number of groups of elements in the carousel
    });
});