ajax - Wordpress 菜单 - ajax 加载

Question

是否可以通过 Ajax 动态加载 Wordpress 菜单？

最好的解决方案是使用 wp_nav_menu()。

Answer 1

如果您的主题需要使用 JavaScript 动态初始化菜单，则初始化代码的模式应该是：

jQuery(function($) {
    function initMainNavigation( container ) {
        /* set up container... */
    }
    initMainNavigation( $( '.main-navigation' ) );

    $( document ).on( 'customize-preview-menu-refreshed', function( e, params ) {
        if ( 'primary' === params.wpNavMenuArgs.theme_location ) {
            initMainNavigation( params.newContainer );
            /* optionally sync a previous menu state from params.oldContainer... */
        }
    });
});

传递给事件处理程序的参数包含以下属性：

• newContainer：包含从 Ajax 检索到的新菜单容器元素的 jQuery 对象；这就是你要操纵的初始化。

• oldContainer：前一个 jQuery 对象，用于保存被替换的菜单容器的元素；如果旧菜单中的任何状态应保留在新菜单中，例如展开哪些子菜单（如二十五），这将很有用。

• wpNavMenuArgs：模板中传递给的参数数组wp_nav_menu()，例如template_location。

• instanceNumber：wp_nav_menu()为其更新调用的索引。

Answer 2

您可以创建一个自定义文件来处理主题中的 ajax 请求，返回wp_nav_menu();并调用该文件的 HTML 输出。

wp-content/themes/your-theme/ajax.php：

<?php wp_nav_menu(); ?>

这很简单，但很有效。不过要小心安全。确保验证输入并且不要eval()输入任何输入！