是否可以通过 Ajax 动态加载 Wordpress 菜单?
最好的解决方案是使用 wp_nav_menu()。
如果您的主题需要使用 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()
为其更新调用的索引。
您可以创建一个自定义文件来处理主题中的 ajax 请求,返回wp_nav_menu();
并调用该文件的 HTML 输出。
wp-content/themes/your-theme/ajax.php:
<?php wp_nav_menu(); ?>
这很简单,但很有效。不过要小心安全。确保验证输入并且不要eval()
输入任何输入!