Question

我已经进行了很多搜索来尝试找出解决方法，并且发现了一些脚本可以完成我想完成的任务，但是我不知道如何将其与我的应用特定的wordpress主题，所以我想在这里寻求帮助：

我正在使用以下主题：http://wpbingosite.com/wordpress/kola/

在移动设备上，当您单击菜单链接时，我希望菜单关闭。我在菜单上使用了哈希链接，该哈希链接滚动到页面的特定部分，并且我不希望用户单击菜单中的哈希链接时认为没有任何反应。

我在搜索时多次发现了这样的脚本，但不确定如何在特定情况下应用该脚本：

    $('.menu ul li a').on("click", function (e) {
    burger.click().removeClass("active");
});

任何帮助将不胜感激！

Answer 1

尝试添加：一个简单的布尔值应该起作用。

//should be closed on startup
var open =false;
$('.menu ul li a').on("click", function (e) {
if(open===true){
document.getElementById('burger').style.display="none";
open=false;
}else{
open=true;
}
});

Answer 2

您需要定位.menu-items并检查该项目是否包含子项或仅仅是一个链接。如果没有子项，则删除导航上的活动类。

(function($) {
    $(".menu-item").click(function () {
        if(!$(this).hasClass("menu-item-has-children")){
            $(".bwp-canvas-navigation").removeClass("active");
        }
    });
})( jQuery );

您应该将其添加到functions.php文件中，并正确排队您的脚本：

add_action( 'wp_enqueue_scripts', 'custom_menu_function' );
function custom_menu_function(){
     wp_add_inline_script( 'custom-menu-handle', '(function($) {$(".menu-item").click(function () {if(!$(this).hasClass("menu-item-has-children")){$(".bwp-canvas-navigation").removeClass("active");}});})( jQuery );' );
}

此功能尚未经过测试，可能需要进行一些调整。

单击菜单链接后关闭菜单

2 个答案: