javascript - 使用ajax获取子页面,如何更改url?

标签 javascript jquery ajax

我有一个完整的页面,其中有这样的菜单:

<li><a href="page1.html">Page 1</a></li>
<li><a href="page2.html">Page 2</a></li>

等等。这在没有 jQuery 的情况下工作得很好,但因为我想要一些侧面变化的动画效果,所以我决定使用 jQuery,例如:

$(document).ready(function(){
    $('a').click(function(e){
        e.preventDefault();
        $('#wrapper').load(link+' .content');
    });
});

通过使用此 jQuery,可以重建 page1.html、page2.html 的精确表示,但使用 ajax 请求。我的问题是,我当然希望网络浏览器中的 url 相应地更改。现在,当我希望在使用 ajax 获取第一个链接时显示“www.mypage.com/page1.html”时,它只会显示“www.mypage.com”。我怎样才能实现这一目标?

最佳答案

如果您以这种方式更改 URL,它将从服务器重新加载整个页面,而这不是您想要做的。

你想做的是SPA。为此,您只能更改 URL 的 anchor 部分,即添加一个哈希值,后跟您想要的任何内容,例如:

www.mypage.com#page1
www.mypage.com#page2

通常,除了更改 url 之外,如果 URL 发生变化,您还希望更改页面内容。这就是所谓的路由,大多数框架(如 Ember.js、Backbone、AngularJS、Durandal 等)都包含一个。由于您不需要框架,因此可以使用独立的框架,例如 router.js 。比路由器文档本身更好,请查找 some examples like this .

关于javascript - 使用ajax获取子页面,如何更改url?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29985708/

相关文章:

javascript - 如何在 useCallback 钩子(Hook)中传递参数?

javascript - 使用 Jquery 动态更改标签 'for' 属性

c# - ajax 请求在 linkbutton asp 回发之前不会首先运行

ajax - 将数据附加到 PJAX 请求

c# - asp.net 中的计时器 watch

javascript - 使用JQuery弹出框

javascript - Angular 模块 ("myApp",[],[])

javascript - AJAX:如何使用返回的数组?

jQuery 上一个下一个元素

javascript - 从顶部滚动后更改元素样式