Question

所以这是一个我一直在摆弄的问题。我有一个基于Bootstrap 3的WordPress驱动的网站。我试图在我的导航栏中有一个链接，当点击它时，打开一个模态对话框。现在，模态代码是正确的，但我不确定如何为链接使用正确的代码

<a href="#myModal" data-toggle="modal" data-target="#myModal">

进入导航栏，因为它是从wp_nav_menu a la

调用的

            <?php
               wp_nav_menu(array(
                  'container_class' => 'collapse navbar-collapse navbar-ex1-collapse',
                  'menu_class'      => 'nav navbar-nav',
                  'menu_id'         => 'Main Menu',
                  'walker'          => new Cwd_wp_bootstrapwp_Walker_Nav_Menu()
              ));
            ?>

并且WordPress中唯一可用的选项是网址和链接文字。我错过了什么吗？

编辑：

我已经尝试通过jQuery实现这一点，根据我在网上看到的提示，但我很难完成它。菜单项ID为 menu-item-221

这是我的jQuery

<script>
jQuery(document).ready(function(jQuery){
    jQUery("#menu-item-221").click(function(){
        jQuery("#paymentmodal").modal('show');
    });
});
</script>

Answer 1

我得到了这个工作，将preventDefault（）添加到代码

jQuery(document).ready(function(jQuery){
    jQuery("#menu-item-221").click(function(e){
        jQuery("#paymentmodal").modal('show');
e.preventDefault();
    });

Answer 2

我已经弄明白了..菜单项不能拥有一个href链接才能工作。我相信浏览器会在调用jQuery之前尝试转到链接。

通过Wordpress中的导航栏进行模态对话

2 个答案: