window.history.pushState与ajax实现无刷新更新页面url
ajax能无刷新更新数据,但是不能更新url
HTML5的新API: window.history.pushState, window.history.replaceState
用户操作history,点击前进后退按钮会触发popstate事件。
这些方法可以协同window.onpopstate
事件一起工作。
改变url的demo
本页是foo.html,url改变成bar.html,内容却不变
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body> <button onclick="changeUrl()">按钮</button> <script>
function changeUrl() {
var stateObj = {foo: 'bar'};
window.history.pushState(stateObj, 'page 2', 'bar.html'); // 这将让浏览器的地址栏显示http://mozilla.org/bar.html,但不会加载bar.html页面也不会检查bar.html是否存在。
} </script>
</body>
</html>
window.history.pushState与ajax实现无刷新更新页面url的更多相关文章
- 使用ajax和history.pushState无刷新改变页面URL
表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...
- 使用ajax和history.pushState无刷新改变页面URL onpopstate(转)
Javascript代码 var htmlData1 = $.ajax( { url: "/getXXXResponse", async: false }).re ...
- 使用ajax和history.pushState无刷新改变页面URL(转)
表现 如果你使用chrome或者firefox等浏览器访问本博客.github.com.plus.google.com等网站时,细心的你会发现页面之间的点击是通过ajax异步请求的,同时页面的URL发 ...
- 使用ajax实现无刷新改变页面内容
如何使用ajax实现无刷新改变页面内容(也就是ajax异步请求刷新页面),下面通过一个小demo说明一下,前端页面代码如下所示 1 <%@ Page Language="C#" ...
- js修改url参数,无刷新更换页面url
一.js修改地址栏URL参数 function changeURLPar(destiny, par, par_value) { var pattern = par + '=([^&]*)'; ...
- pushState与ajax实现无刷新加载
一.JS代码: $(document).ready(function() { getContent();//初始化页面 $("nav a").click(function() { ...
- 使用pjax实现类似github无刷新更改页面url
pjax=pushState+ajax,相信用过github的同学都知道,github部分页面采用了pjax这个项目来实现ajax无刷新加载的同时改变页面url.一起来学习一下这个插件吧. 我们都知道 ...
- 使用Jquery的Ajax实现无刷新更新,修改,删除页面
本文将向大家讲述一下最近工作的一些总结,主要包括了以下内容,注册界面以及详细信息界面的编辑.主要是介绍了AJAX技术,因为我觉得其他方面没什么好介绍的.首先是跟大家说一下Ajax的优点,假如你删除了一 ...
- 使用ajax和window.history.pushState无刷新改变页面内容和地址栏URL
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
随机推荐
- UIButton的常用属性
可以通过代码的方式创建UIButton 通用实例化对象方法: UIButton *button = [[UIButton alloc] initWithFrame:rect]; 快速实例化对象方法: ...
- poj 3264 Balanced Lineup (RMQ)
/******************************************************* 题目: Balanced Lineup(poj 3264) 链接: http://po ...
- const in C++
const关键字是C++中常用的类型修饰符,用法非常灵活,使用const将大大改善程序的健壮性. const的作用 1. 定义const常量: 比如: const int Max = 100; 2. ...
- NSDate获取当前时间,并且转化为需要的格式
NSDate *date = [NSDate date]; NSDateFormatter *formatter = [[NSDateFormatter alloc]init]; [formatter ...
- Windows上安装Maven
Maven的具体参考书可以看:<Maven实战> 下载maven可以到:http://maven.apache.org/ Maven的eclipse基本使用可以在这里看到:http://w ...
- android里R.layout.的问题
今天,在Exlipse里的一个项目在.java文件里写 setContentView(R.layout.activity_problem);时,显示错误,以为是R.java文件里没有对应的activ ...
- [ERROR] Fatal error: Can't open and lock privilege tables: Table 'mysql.host' doesn't exist
mysql 启动总是报错: 错误日志中显示: [ERROR] Fatal error: Can't open and lock privilege tables: Table 'mysql.host' ...
- 【Mysql】权限管理
mysql权限介绍 mysql中存在4个控制权限的表,分别为user表,db表,tables_priv表,columns_priv表. mysql权限表的验证过程为: 1.先从user表中的Host, ...
- 水果项目第3集-asp.net web api开发入门
app后台开发,可以用asp.net webservice技术. 也有一种重量级一点的叫WCF,也可以用来做app后台开发. 现在可以用asp.net web api来开发app后台. Asp.net ...
- jsp-avaBean
package javaBean; public class pagecount { private long count=0; public long getcount() { return cou ...