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

【问题标题】：Modal dialogue through the navbar in Wordpress通过 Wordpress 中的导航栏进行模态对话
【发布时间】：2014-12-15 05:14:01
【问题描述】：

所以这是一个我一直在摆弄的问题。我有一个基于 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 中唯一可用的选项是 url 和链接文本。我错过了什么吗？

编辑：

根据我在网上看到的提示，我尝试通过 jQuery 完成此操作，但无法完成。菜单项 ID 为 menu-item-221

这是我的 jQuery

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

【问题讨论】：

标签： jquery wordpress twitter-bootstrap

【解决方案1】：

我通过在代码中添加 preventDefault() 来实现这一点

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

【讨论】：

【解决方案2】：

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

【讨论】：