Home » jQuery 外掛

[jQ]jQuery history plugin

範例 1
沒錯!只要 1,600 元就能獲得我們團隊完整的協助,讓效果能迅速的整合到您的網站,並保證瀏覽器的相容性。
立刻申請!



現在網頁很多都用所謂的 Ajax的效果,但因為在網址沒有改變的情況下是無法利用瀏覽器的上一步或下一步來回到其它頁面的。而 jQuery history plugin 則利用了各種有趣的方式(iframe)來達到在 Ajax 中也能有狀態的記錄。

套件名稱:jQuery history plugin
套件版本:N/A
作者網站:http://tkyk.github.com/jquery-history-plugin/
套件網址:N/A
發佈日期:2010-09-12
檔案大小:6.31 KB
檔案下載:jquery.history.js

參數說明:

檢視原始碼 JavaScript
1
2
3
4
5
6
7
callback(選填)
描述: 當載入 hash 後要執行的動作
預設值: undefined
 
unescape(選填)
描述: 是否把 hash 內容進行編碼
預設值: false

方法說明:

檢視原始碼 JavaScript
1
2
3
4
5
// 初始化 $.history
$.history.init(callback, options);
 
// 載入 hash 並觸發 callback
$.history.load(hash);

使用範例:

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.history.js"></script>
<style type="text/css">
	#content {
		border: 1px solid #666;
		width: 300px;
		height: 300px;
		padding: 0.5em;
	}
</style>
<script type="text/javascript">
	$(function($) {
		// 當 hash 改變時 callback 用
		function load(num) {
			$('#content').load(num +".html");
		}
 
		// 初始化 $.history
        $.history.init(function(url) {
			load(url == "" ? "1" : url);
		});
 
		// 當點擊 #ajax-links 中的超連結時
		$('#ajax-links a').live('click', function(e) {
			var url = $(this).attr('href');
			// 取得 #hash 去除掉 # 後的值
			url = url.replace(/^.*#/, '');
			// 載入
			$.history.load(url);
			return false;
		});
	});
</script>
 
<body>
	<div id="ajax-links">
		<ul>
			<li><a href="#1">load 1.html</a></li>
			<li><a href="#2">load 2.html</a></li>
			<li><a href="#3">load 3.html</a></li>
		</ul>
		<div id="content"></div>
	</div>
</body>
範例 1

檔案描述
基本的範例檔案(免空) 開始下載
基本的範例檔案 會員限定

2 筆針對 [jQ]jQuery history plugin 的迴響

  1. 大大您好:
    我想請問一下
    如果使用這個插件
    是否會影響到SEO?
    因為裡面的內容不會被搜尋引擎收錄到?

  2. 想請問一下
    使用此插件
    是否會影響到seo?
    內容是否不會被收錄進去?
    因為http://www.dah-sing.com.tw/project.html
    裡面的內容都沒有被收錄到的樣子!
    是否有辦法可以改善?

發表迴響