PushState+Ajax 完美实现无刷新
转载自:http://lazynight.me/1897.html
折腾一下PJAX,利用HTML5的新API,实现历史记录的完美导入。
不知道你用没用过Github,里边的目录跳转就是用html5的pushstate做的,效果很酷。
还有一个关于web知识的宣传网站,http://www.20thingsilearned.com/en-US
你可以完美的前进后退,并且可以与好友分享特定页面,实现方法?不用我说了吧。
实现PJAX只需要以下几点:
pushState(state,– Add one history state into browser history and update the URL in the browser window
title, url)replaceState(state,– operates exactly like history.pushState() except that replaceState() modifies the current history entry instead of creating a new one.
title, url)window.onpopstate–
A popstate event is dispatched to the window every time the active history entry changes.
If the history entry being activated was created by a call to pushState or affected by a call to replaceState, the popstate event’s state property contains a copy of the history entry’s state object.
不想手写?拿来主义?
好吧,这里推荐给你一个现成的文件History.js,完美支持HTML4与HTML5,
在HTML5浏览器使用新API,HTML4浏览器继续锚点的干活…
https://github.com/balupton/History.js
试了一下,把wp主题给整了一个PJAX版本,效果不错,继续挖掘中。
想折腾的朋友,可以开始动手了。
PushState+Ajax 完美实现无刷新的更多相关文章
- nodejs利用ajax实现网页无刷新上传图片
nodejs利用ajax实现网页无刷新上传图片 标签(空格分隔): nodejs 通常情况下上传图片是要通过提交form表单来实现的,但是这又不可避免的产生了网页转. 利用ajax技术和FormDat ...
- 本篇文章主要是对jquery+ajax+C#实现无刷新操作数据库数据的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
我们知道同步执行和异步执行的区别,为了更好的提高用户的体验,我们都会采用异步方式去处理一些问题,毕竟单线程的同步可能回造成卡死等现象,很不友好,所以可以使用ajax来完成用户的体验,现在我们就来说说如 ...
- ajax完成list无刷新返回
ajax完成list无刷新返回 ajax无刷新技术总结,以下是一段我写的ajax应用的js脚本.其中提交的data刚开始我采用的是$('#formId').serialize();但是出现乱码问题,为 ...
- HTML5新api即pushState和replaceState实现无刷新修改url
1,首先我面临一个需求,页面回退时需要知道来之前的页面状态.很简单,回退时在url里赋参数即可.问题是在ipad上,回退按钮是安卓那边的,我控制不了.只好采用js无刷新修改url历史记录,来告诉服务器 ...
- HTTP与AJAX深入揭秘,不使用AJAX实现页面无刷新
AJAX的原理是什么? 实际上就是发起HTTP请求,既然就是发起HTTP请求,那只要我们能够实现发起HTTP请求就可以在不使用AJAX的情况下实现相同的效果. 在前端有好多方式可以发起HTTP请求,比 ...
- jquery+ajax(用ajax.dll)实现无刷新分页
利用ajax.dll那种方式的无刷新,在这就不说了,新朋友可以看下我的另一片文件http://www.cnblogs.com/dachuang/p/3654632.html 首先,这里用的是jquer ...
- Ajax+Asp.Net无刷新分页
1.新建解决方案,并建立四个项目BLL,DAL,Model,PagerTest,如图所示: 2.Model代码 using System; using System.Collections.Gener ...
- ASP.NET Ajax简单的无刷新分页
最近练习了一些AJAX无刷新分页,写得比较简单,性能不知道怎么样,求大神指点,如有更好的分页提供,欢迎交流! 发话不多说了,直接上代码! 首先从网上下了一个JS分页,感觉挺好用的 (function( ...
- jQuery+AJAX实现网页无刷新上传
新年礼,提供简单.易套用的 jQuery AJAX上传示例及代码下载.后台对文件的上传及检查,以 C#/.NET Handler 处理 (可视需要改写成 Java 或 PHP). 有时做一个网站项目 ...
随机推荐
- Go语言中的UDP应用
Go语言中的UDP应用 Go语言中使用UDP是很方便的,net包提供了UDP和TCP的功能,这里使用UDP做了一个UDP广播,然后接收各个设备的返回信息.实现起来很快,总体感觉比使用C#中的UDP更优 ...
- sort()的部分用法
#include <iostream> #include <cstdio> #include <algorithm>//sort要包含的头文件 #include & ...
- [JSOI2007] 建筑抢修 (贪心 + 优先队列)
小刚在玩JSOI提供的一个称之为“建筑抢修”的电脑游戏:经过了一场激烈的战斗,T部落消灭了所有z部落的入侵者.但是T部落的基地里已经有N个建筑设施受到了严重的损伤,如果不尽快修复的话,这些建筑设施将会 ...
- 一起来学习Shell脚本
Shell脚本 Shell脚本(shell script),是一种为shell编写的脚本程序. 大家所说的shell通常都是指的shell脚本,但其实shell与shell脚本是两个不同的概念.由于习 ...
- 关于xampp 集成开发包电脑重启mysql无法启动的问题
关于xampp 集成开发包电脑重启mysql无法启动的问题. 在做php开发时,安装过xampp,也不知道是版本老了还是什么问题,总是出现当天晚上下班关机,第二天上班mysql不能启动,在网上查找些资 ...
- python中判断输入是否为数字(包括浮点数)
1.当num确定为数字后 num=123.4print(isinstance(num,float))#判断是否为浮点数 print(isinstance(num,int))#判断是否为整数 2.当nu ...
- vs编译报错 BLOCK_TYPE_IS_VALID(pHead->nBlockUse)
1.重复释放内存导致,new delete和malloc free两个组合分配的堆空间都不能重复释放两次: 2.用delete或者free释放栈空间导致内存空间被破坏(栈空间内存的头部有系统写入的一些 ...
- nodejs的交叉(跨平台)编译(to android)
nodejs的二进制包有两种安装方式node-gyp以及node-pre-gyp 这两条命令会写入该包的安装脚本. node-gyp是使用gyp工具编译源码,因此必须指定交叉编译器(参见http:// ...
- 【个人训练】(POJ3279)Fliptile
最近在刷kuangbin神犇的各种套题....感觉自己好弱啊.....还是要多多训练,跟上大神的脚步.最近的这十几题都比较水,记下来这一条我比较印象深刻.也比较难的题目吧(之后应该不会再有水题写了,珍 ...
- mysql 5.7.18 源码安装笔记
之所以贴出这样一篇笔记呢?主要是因为很久之前,源码安装MySQL的时候,碰到了太多太多的坎坷. 如果你有兴趣进行源码安装,那么请不要以这篇文章为标准,因为每个人的及其环境等其他因素还是差距比较大的. ...