码迷,mamicode.com
首页 > Web开发 > 详细

history.pushState 实现ajax无刷新更改url

时间:2014-11-13 20:36:46      阅读:226      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   io   color   ar   sp   div   on   

暂时没啥心得,直接上例子。

 1 <html>
 2 <head>
 3 <title>
 4 fasd
 5 </title>
 6 <script>
 7 window.addEventListener(popstate, function(e){
 8   if (history.state){
 9     var state = e.state;
10     console.log(state.title);
11   }
12 }, false);
13 
14 function ok(id){
15     var url = http://www.test.com/test.php?arg= + id;
16     var title = id + title;
17     var state = {
18             title: title,
19             url: url,    
20         };
21     history.pushState(state, title, url);
22     console.log(url);
23 }
24 </script>
25 </head>
26 
27 <body>
28 1</br>
29 <a onclick="ok(1);">1****1</a></br>
30 <a onclick="ok(2);">2****2</a></br>
31 <a onclick="ok(3);">3****3</a></br>
32 <a onclick="ok(4);">4****4</a></br>
33 <a onclick="ok(5);">5****5</a></br>
34 <a onclick="ok(6);">6****6</a></br>
35 </body>

 

参考:

http://yansong.me/2013/01/11/learning-history.pushState-and-history.replaceState.html

http://www.welefen.com/use-ajax-and-pushstate.html

 

history.pushState 实现ajax无刷新更改url

标签:style   blog   http   io   color   ar   sp   div   on   

原文地址:http://www.cnblogs.com/krytor/p/4095646.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!