0

我正在尝试使用 ajax 在我的 wordpress 站点中加载新页面,使用 wp_nav_menu 和永久链接设置,例如:/wp-admin/admin-ajax.php?post_name=%postname%/ 将请求路由到 admin-ajax where我可以正确处理它(根据 wordpress 文档。)但是 wordpress 只是忽略了我的永久链接并坚持使用其默认链接设置。

这是执行此操作的正确方法还是我会更好地重写 .htaccess 文件,这是否会导致更新到新版本的 wp 时出现问题?

提前感谢您的任何答案。

4

1 回答 1

1

CSS Tricks 的 Chris 有一个很棒的 AJAX 页面加载教程,关于他的解决方案操作系统最好的一点是它仍然适用于不支持 JavaScript 的旧浏览器。

脚本

<script type="text/javascript">
/*
 * Your navigation bar, can be "document" or body if you want to 
 * apply to every link on your site
*/
var $navigation = $("#site-menu");

//Your main content that will be replaces
var body = "#page-body";
var $body = $(body);

$navigation.delegate("a", "click", function() {
    window.location.hash = $(this).attr("href");
    return false;
});

$(window).bind('hashchange', function() {
    var newHash = window.location.hash.substring(1);
    if(newHash) {
        $body.fadeOut(200, function() {
            $body.hide().load(newHash + " " + body, function() {
                $body.fadeIn(200, function() {
                });
            });
        });
    };
});

$(window).trigger('hashchange');
</script>

菜单

像往常一样添加您的菜单,确保添加站点菜单 id 一些标签,该标签包含您想要 ajax 加载的菜单链接。

<div id="site-menu">
    <?php wp_nav_menu(); ?>
</div>

细节

$navigation 下的所有链接都将添加一个单击事件,该事件将更新窗口 url 哈希。该窗口正在侦听哈希更改,并将使用哈希值发出 AJAX 请求以重新加载 $body html。

优势

  • 历史(后退和前进)导航将起作用:
  • 同一个站点将适用于支持 JavaScript 的浏览器和不支持 JavaScript 的浏览器;
  • 如果您复制过去的 url,脚本将加载正确的页面;
  • 因为我们使用的是委托函数,所以通过 ajax 加载结果添加的任何链接也将添加点击事件

坏处

  • 您不能再在您的网站上使用锚点

有关更多信息和示例,请参阅:http ://css-tricks.com/video-screencasts/85-best-practices-dynamic-content/

于 2012-06-12T11:34:00.430 回答