jQuery pjax 應用簡單示例

2021-09-17 01:39:26 字數 1412 閱讀 2100

pjax 是乙個jquery外掛程式,它使用ajaxpushstate來實現快速的瀏覽體驗,包括真正的固定鏈結,頁面標題和工作返回按鈕。

ajax缺點是破壞了瀏覽器的前進後退,因為ajax的請求不會留在歷史記錄中。pjax就不一樣了,pjax被解釋成ajax+pushstate的封裝,因為它把ajax的請求寫入歷史記錄,並反映在位址列,這樣使用者就能愉快地使用前進後退了。pjax有好幾個實現方法,這裡使用最常用的jquery庫,使用jquery.pjax.js。演示**的伺服器端使用php指令碼語言。

go to 第一頁.第二頁

res1.php

<?php 

echo "第一頁

";

res2.php

<?php 

echo "第二頁

";

解釋:$(document).pjax('a', '#container')其中a是觸發元素,#container是裝載pjax返回內容的容器,下面也是這樣。

伺服器端**:

res3.php:

<?php 

echo "第三頁

";

window.history.pushstate(state, title, url);

// // @狀態物件: 記錄歷史記錄點的額外物件,可以為空.

// @可選的url: 瀏覽器不會檢查url是否存在,只改變url.url必須同域,不能跨域.

pjax其實就是html5 window.history.pushstate(state, title, url)這個新的api加上傳統的ajax技術,一般用來實現無重新整理的頁面載入.pushstate的作用主要是:改變url和新增返回歷史.這樣ajax無重新整理載入頁面後,使用者還可以正常進行後退和前進,js的window.history.back()和window.history.forward()也能正常工作.下面就是乙個用pushstate + jquery ajax實現的無重新整理的頁面載入,不支援的瀏覽器則自動退化成開啟原始的鏈結開啟形式.

index.php:

data.php

data.php:

<?php

if(isset($_get['pjax'])) else ?>

注意,js統計**應該放到main塊裡面才能正常統計頁面訪問數.

NSDictionary plist簡單示例

在iphone ipad工程裡面,新增 file other property list,例如 test.plist,然後在其中新增3個專案 key name,date,dept,並填充value值。以下為對此test.plist檔案的一系列常用操作 myname,mydate,mydept為定義的...

NSDictionary plist簡單示例

在iphone ipad工程裡面,新增 file other property list,例如 test.plist,然後在其中新增3個專案 key name,date,dept,並填充value值。以下為對此test.plist檔案的一系列常用操作 myname,mydate,mydept為定義的...

php中鉤子 hook 的應用簡單demo示例

我們先來回顧下原本的開發流程 產品汪搞出了一堆需求 當使用者註冊成功後需要傳送簡訊 傳送郵件等等 然後聰明機智勇敢的程式猿們就一撲而上 把這些需求轉換成 扔在 使用者註冊成功 和 跳轉到首頁 之間 沒有什麼能夠阻擋 充滿創造力的猿們 class test test new test test ind...