10 個基于jQuery的表單增強腳本和插件

openkk 12年前發布 | 7K 次閱讀 jQuery

以下10個基于jQuery的腳本和插件可以有效地提高表單的可訪問性和功能性,本文中的一些源碼和演示也許能幫助你優化當前的表單,使訪問者獲得良好的用戶體驗。

1. Form Hints 1.0

使用這個插件,你可以為網站中的的任何一個表單控件添加描述文字,可以通過title屬性來添加。用戶可以點擊控件來顯示或隱藏描述文字。

10 個基于jQuery的表單增強腳本和插件


源碼+演示

2. jQuery 表單選擇器

jQuery的許多表單選擇器可以更加方便和高效地訪問表單元素。下面是一個簡單的jQuery表單選擇器相關介紹。

10 個基于jQuery的表單增強腳本和插件


源碼 / 演示

3. Web SpinButton

這是一個關于文本框數值微調按鈕控件的示例。

10 個基于jQuery的表單增強腳本和插件


源碼+演示

4. 頁面跳轉警告

添加該腳本后,在你離開頁面前,會彈出一個警告,提示你提交表單或進行其他類似的操作。

10 個基于jQuery的表單增強腳本和插件


源碼 / 演示

5. 推ter 提示框

添加該腳本后,會出現一個類似推ter的簡單有趣的提示框。

10 個基于jQuery的表單增強腳本和插件


源碼+演示

6. Unwrongest

添加這個jQuery插件后,文本框的大小會隨著輸入的內容自動進行調整,就像非死book的Boxes一樣。

10 個基于jQuery的表單增強腳本和插件


源碼 / 演示

7. Clearfield

當輸入框內沒有內容時,利用這個插件可以顯示輸入提示。

10 個基于jQuery的表單增強腳本和插件


源碼+演示

8. 選中多個元素

利用這個腳本,可以在所有供你選擇的條目中選擇全部,或只選擇需要的元素集合。

10 個基于jQuery的表單增強腳本和插件


源碼 / 演示

9. 將表單label顯示在輸入框中

添加該腳本后,可以將表單的label值顯示在輸入框中,使界面更加簡潔。

10 個基于jQuery的表單增強腳本和插件


源碼 / 演示

10. 自動保存

這個插件增強了表單功能,可以自動將表單字段保存到cookies中。每經過一定的時間(默認為10秒)或離開頁面時自動進行保存。

10 個基于jQuery的表單增強腳本和插件


源碼+演示

英文原文:http://www.jquery4u.com/forms/10-jquery-form-%E2%80%93-accessibility-functionality/


本文轉載自: iteye

 本文由用戶 openkk 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!