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学习笔记-基础类型
基础类型 布尔值 布尔值的类型为bool,值是true或false,默认为false. //示例代码 var isActive bool // 全局变量声明 var enabled, disabled ...
- .Net 面试题 汇总(二)
51..net中读写XML的类都归属于哪些命名空间? 答:System.Xml 52.解释一下UDDI.WSDL的意义及其作用. 答:UDDI即统一描述.发现和集成协议.作用: 用来说明一个Web服务 ...
- urllib,url中链接包含汉字怎么用百分号(%)加密处理
使用urllib中的quote,和unquote方法将汉字编码成gbk(2个百分号对应一个汉字)或者utf8(3个百分号对应一个汉字) 注意用%加密汉字时,汉字不能是Unicode编码格式,否则会报错 ...
- React开发时候注意点
JSX 使用jsx的使用,用一个{}包裹起来,例如 const method = {<div> 123 </div>} 使用()小括号,防止分号自动插入 const eleme ...
- Python-学习-小例子练习
网上了点小例子,练习一下下,都是特别简单的.而且这些代码也都是找的网上的代码,目的是在于练习一下Python和熟悉下Python的编码风格等等 学习一门语言,最快的方法就是把它用在世界的开发中,这样才 ...
- OpenStack配置虚拟机vcpu绑定步骤 转至元数据结尾
. Changed in compute node: 给宿主机预留资源: 宿主机可用cpu:cpuid – cpuid 宿主机可用内存:25G #vim /etc/nova/nova.conf vcp ...
- 数据结构与算法之顺序栈C语言实现
顺序栈是一种特殊的顺序表,主要操作是入栈和出栈.将顺序表加一些特定限制,就成了顺序栈. 注: 1.顺序栈C语言实现: 2.按较简单的方式实现,主要帮助理解,可在此基础上修改,更加完善: 3.提供几个简 ...
- NLP系列-中文分词(基于词典)
中文分词概述 词是最小的能够独立活动的有意义的语言成分,一般分词是自然语言处理的第一项核心技术.英文中每个句子都将词用空格或标点符号分隔开来,而在中文中很难对词的边界进行界定,难以将词划分出来.在汉语 ...
- [C/C++] new/delete和malloc/free基本区别
/**便于遗忘时复习**/ 区别一:本质 new/delete 在C++中是运算符不是函数,需要编译器支持.malloc/free是库函数,需要头文件支持,在C语言中使用. 区别二:开辟内存大小 用 ...
- POJ 2168 Joke with Turtles(DP)
Description There is a famous joke-riddle for children: Three turtles are crawling along a road. One ...