pjax 使用怎么用 有一个DEMO吗

The page is temporarily unavailable
nginx error!
The page you are looking for is temporarily unavailable.
Please try again later.
Website Administrator
Something has triggered an error on your
This is the default error page for
nginx that is distributed with
It is located
/usr/share/nginx/html/50x.html
You should customize this error page for your own
site or edit the error_page directive in
the nginx configuration file
/etc/nginx/nginx.conf.The page is temporarily unavailable
nginx error!
The page you are looking for is temporarily unavailable.
Please try again later.
Website Administrator
Something has triggered an error on your
This is the default error page for
nginx that is distributed with
It is located
/usr/share/nginx/html/50x.html
You should customize this error page for your own
site or edit the error_page directive in
the nginx configuration file
/etc/nginx/nginx.conf.pjax使用总结(踩的一堆坑) - 简书
pjax使用总结(踩的一堆坑)
三个页面,页面的公共部分相同
&title&&/title&
&meta http-equiv="content-type" content="text/ charset=gbk"&
&script type="text/javascript" src="jquery-1.9.1.js"&&/script&
&script type="text/javascript" src="jquery.pjax.update.js"&&/script&
&script type="text/javascript"&
$(document).pjax('a[data-pjax]', '.container', {
maxCacheLength:0,
cache: false,
fragment: ".container",
timeout: 8000
$(function () {
$('.container').delegate('#redbtn', 'click', function () {
url: 'demo2.html',
container: '.container',
maxCacheLength:0,
cache: false,
fragment: ".container",
timeout: 8000
body内的部分
&div class="content"&
&a href="demo1.html" data-pjax&demo1&/a&
&a href="demo.html" data-pjax&demo&/a&
&img src="abc.jpg"/&
&div class="container"&
这是变化的部分
demo1.html body内的部分
&div class="content"&
&a href="demo1.html" data-pjax&demo1&/a&
&a href="demo.html" data-pjax&demo&/a&
&img src="abc.jpg"/&
&div class="container"&
&button type="button" id="redbtn"&redirect (BUG full page reload)&/button&
这是变化的部分
demo1.html
demo2.html body内的部分
&div class="content"&
&a href="demo1.html" data-pjax&demo1&/a&
&a href="demo.html" data-pjax&demo&/a&
&img src="abc.jpg"/&
&div class="container"&
hello 这是变化的部分
demo2.html
三个页面的内容基本相同
说下遇到的坑
首先 如果每个页面对应一个js ,使用&script src&引入,点击加载相应页面的时候加载对应js,需要把&script src&写在pjax container div内部,不然不会加载。
即使&script src&加在container内部,也有问题,第一次跳转该页面的时候会加载一次该js,再次点击就不会重新加载(缓存引起),js内部执行初始化的代码就不会被执行。 博客里提供了修改后的pjax代码:注释下面两行代码
//obj.scripts = findAll(obj.contents, 'script[src]').remove()
//obj.contents = obj.contents.not(obj.scripts)
还增加了一个cache配置属性 用于解决IE缓存问题 默认为false
点击a标签跳转页面时有时全局刷新有时局部刷新,因为没设置timeout:8000,pjax默认的超时时间是1s,超时就会进行全局加载^_^。
业精于勤,荒于嬉;行成于思,毁于随。整合pjax无刷新翻页加载教程 - 鬼少博客 - emlog博客_音乐博客_技术博客_原创博客_emlog模板_emlog插件_emlog教程_音乐插件_浮窗音乐插件_pjax技术_}

我要回帖

更多关于 pjax 使用 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信