Home » jQuery 外掛

[jQ]jQuery.suggest 1.20

[ 日期： | 瀏覽：4,252 | 迴響：搶沙發 ]
範例 1
請協助我把這個效果加到我的網站 (只要 300 元)
沒錯!只要 300 元就能獲得我們團隊完整的協助，讓效果能迅速的整合到您的網站，並保證瀏覽器的相容性。
立刻申請!



jQuery.suggest 提供了類似自動完成的效果，但它是用像建議字的方式來顯示。輸入時可以一字一字慢慢輸入並一一顯示符合的建議字，如果看到的建議字就是要輸入的內容的話，也可以直接按下 Enter 或 Tab 鍵來自動補好哩！

套件名稱：jQuery.suggest
套件網址：1.20
作者網站：http://polarblau.github.com/suggest/
套件網址：N/A
發佈日期：2012-04-05
檔案大小：7.28 KB
檔案下載：jquery.suggest.js

參數選項說明：

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

source(必填)
描述： 要用來當做建議字用的陣列
預設值： 無
 
suggestionColor(選填)
描述： 建議字的顏色
預設值： '#ccc'
 
moreIndicatorClass(選填)
描述： 用來提示還有更多建議字的區塊所套用的樣式
預設值： 'suggest-more'
 
moreIndicatorText(選填)
描述： 用來提示還有更多建議字的顯示文字
預設值： '…'(就是...)

方法說明：

檢視原始碼 JavaScript
1
2

// 把指定的輸入框元素加上 suggest 效果
$(selector).suggest(source, options);

使用範例：

檢視原始碼 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

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.suggest.js"></script>
<style type="text/css">
	#search {
		padding: 5px;
		font-size: 16px;
		letter-spacing: 0;
		position: relative;
		color: #333;
		width: 200px;
		background: #fff;
		z-index: 10;
	}
</style>
<script type="text/javascript">
	$(function(){
		// 建議字陣列
	    var haystack = ['ActionScript', 'Android', 'APP', 'abgne.tw', 'Java', 'JavaScript', 'jQuery'];
 
		// 把 #search 加上建議字的效果
		// 建議字的顏色為紅色
		$('#search').suggest(haystack, {
			 suggestionColor : 'red'
		});	
	});
</script>
 
<body>
	<input type="text" name="search" id="search" />
	<span>全部的建議字有: ActionScript, Android, APP, abgne.tw, Java, JavaScript, jQuery</span>
</body>
範例 1

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

發表迴響