Home » jQuery 外掛

[jQ]Input Hints 1.1

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

Input Hints 1.1

有時使用者可能不知道輸入框要輸入怎樣的值,若能提供一些預設值來提示的話,這樣能讓使用者經驗更好。而 Input Hints 就是能達到這樣效果的套件。

套件名稱:Input Hints
套件版本:1.1
作者網站:http://remysharp.com/2007/01/25/jquery-tutorial-text-box-hints/
套件網址:http://plugins.jquery.com/project/hint
發佈日期:2008-07-01
檔案大小:1.08 KB
檔案下載:jquery.hint.js

參數說明:

檢視原始碼 JavaScript
1
2
3
blurClass(選填)
描述: 提示字串的 className
預設值: 'blur'

方法說明:

檢視原始碼 JavaScript
1
2
// 使用 hint 效果
$(selector).hint([blurClass]);

使用範例:

檢視原始碼 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
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.hint.js"></script>
<style type="text/css">
	input.blur {
		color: #999;
	}
	.myBlur {
		color: #f00;
	}
</style>
<script type="text/javascript">
	$(function(){
		// 幫 input 加上提示,用預設的 className(blur)
		$("input[title!='']").hint();
		// 幫 textarea 加上提示,並用自訂的 className
		$("textarea[title!='']").hint("myBlur");
	});
</script>
 
<body>
	<div>
		<input type="text" name="seach" value="" id="search" title="請輸入名稱或匿稱" /><br />
		<textarea name="textarea1" id="textarea1" title="請輸入其它關鍵字"></textarea>
	</div>
</body>

範例 1

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

附註:
Input Hints 的提示來源是參考到該元素的 title 屬性,請務必要設定才有效用。

發表迴響