pushState是一個可以操作history的api，該api的介紹和使用請見這里：//www.welefen.com/use-ajax-and-pushstate.html

目前已經(jīng)有//github.com/, //plus.google.com, //www.welefen.com 等網(wǎng)站已經(jīng)使用。

pjax是對ajax + pushState的封裝，讓你可以很方便的使用pushState技術(shù)。

同時支持了緩存和本地存儲，下次訪問的時候直接讀取本地數(shù)據(jù)，無需在次訪問。

并且展現(xiàn)方式支持動畫技術(shù)，可以使用系統(tǒng)自帶的動畫方式，也可以自定義動畫展現(xiàn)方式。


jquery版
將jquery.pjax.js部署到你的頁面中，將需要使用pjax的a鏈接進行綁定（不能綁定外域的url），如:

[code]
$.pjax({
selector: 'a',
container: '#container', //內(nèi)容替換的容器
show: 'fade', //展現(xiàn)的動畫，支持默認和fade, 可以自定義動畫方式，這里為自定義的function即可。
cache: true, //是否使用緩存
storage: true, //是否使用本地存儲
titleSuffix: '', //標題后綴
filter: function(){},
callback: function(){}
})
[/code]

pjax高級使用技巧：

關(guān)于pjax這里就不多介紹了，簡單易用，輕松地實現(xiàn)部分刷新，告別鏈接帶來的閃爍。
之前看過pjax并實現(xiàn)了demo，還寫了篇筆記，不過jquery 1.9把live()方法刪掉了，新版pjax也隨之換了用on()方法實現(xiàn)，最近項目有用到，所以了解了新的使用方法，這里也做一個新的筆記。

環(huán)境：
jquery 1.10.2
jquery.pjax.js 下載

使用方法：
監(jiān)控所有class為pjaxlink的鏈接，采用pjax更新鏈接頁面中id為ToInsert的容器內(nèi)容到本頁面中id為Content的容器中。若獲取內(nèi)容時間超過5秒，則直接跳轉(zhuǎn)：

[code]
$(document).pjax('a.pjaxlink', '#Content', {fragment:'#ToInsert', timeout:5000});
[/code]

使用實例：
原始頁面是通過跳轉(zhuǎn)的翻頁，我在不改變頁面內(nèi)容的前提下，使用pjax監(jiān)控翻頁鏈接，僅更新列表（保證列表容器是分頁容器的父節(jié)點）的內(nèi)容。

[code]
if ($.support.pjax) {
    //遍歷所有分頁容器
    $('.pagercontainer').each(function(){
        //取得列表容器
        $listcontainer=$(this).parent();
        //取得列表容器的ID
        var listcontainerid=$listcontainer.attr('id');
        //用pjax監(jiān)控所有分頁鏈接并定義pjax來實現(xiàn)更新
        $(document).pjax('#'+listcontainerid+' .pagercontainer a', '#'+listcontainerid, {fragment:'#'+listcontainerid, timeout:5000});
    });
    $(document).on('pjax:send', function() {
        //在pjax發(fā)送請求時，顯示loading動畫層
        $('#loading').show();
    });
    $(document).on('pjax:complete', function() {
        //在pjax處理完成后，隱藏loading動畫層
        //由于速度太快會導到loading層閃爍，影響體驗，所以在此加上500毫秒延遲
        setTimeout(function(){$('#loading').hide()},500);
    });
}
[/code]