有時使用者可能不知道輸入框要輸入怎樣的值，若能提供一些預設值來提示的話，這樣能讓使用者經驗更好。而 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> |
附註：
Input Hints 的提示來源是參考到該元素的 title 屬性，請務必要設定才有效用。