脚本

Question

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

这是正确的方法吗？或者我会更好地重写.htaccess文件，这会导致更新到新版本的wp时出现问题吗？

提前感谢您的任何答案。

Answer 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。

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

详细

$ navigation下的所有链接都会添加一个点击事件，用于更新窗口网址哈希。窗口正在侦听哈希更改，并将使用哈希值来发出AJAX请求以重新加载$ body html。

优势

历史（后退和前进）导航将起作用：
同一网站适用于支持JavaScript和浏览器的浏览器
如果您复制过去的网址，则脚本会加载正确的网页;
因为我们正在使用委托功能，所有通过ajax加载结果添加的链接也会添加click事件

缺点

您无法再在自己的网站上使用锚点

有关详细信息和示例，请参阅：http://css-tricks.com/video-screencasts/85-best-practices-dynamic-content/

永久链接到admin-ajax.php

1 个答案:

脚本

菜单

详细

优势

缺点