JQ筆記05.Jquery表單表格的操作

5.1 表單應用

5.1.1單行文本框應用

【代碼5.1.1.1】單行文本框應用舉例:獲取和失去焦點改變樣式(很常用)。

【代碼5.1.1.2】獲取焦點時文本高亮顯示並且清除默認的值,失去焦點時恢復原來。(非常常用)

5.1.2多行文本框應用

【代碼5.1.2.1】多行文本框高度變化

【代碼5.1.2.2】多行文本框高度變化,加上動畫方法animate(),可以增加緩衝效果。

【代碼5.1.2.3】通過控制多行文本框滾動條的變化,使文本框裏的內容滾動。需要控制scrollTop屬性。

5.1.3複選框應用

【代碼5.1.3.1】通過點擊按鈕實現複選框的全選和反選

【代碼5.1.3.2】點擊複選框實現全選和全不選,實現思路如下:

【代碼5.1.3.3】實現全選的另類思路,實現效果同上。

【代碼5.1.4】下拉框的應用舉例,很經典——將左邊選中項添加給右邊,或者雙擊添加給右邊,右邊同樣可以添加給左邊。

【代碼5.1.5】表單驗證案例一,需求如下:(相當經典)

代碼比較長,不再展示,具體請參考源碼,這裏列出運行效果:

5.2 表格應用

5.2.1表格變色

【代碼5.2.1.1】表格隔行換色(去掉表頭)

【代碼5.2.1.2】單選按鈕控制表格某行高亮

【代碼5.2.1.3】多選框控制表格多行高亮

【代碼5.2.1.4】多選框控制表格多行高亮(簡化代碼)

【代碼5.2.2】表展開與關閉——用表格實現一個後臺管理菜單

【代碼5.2.3】表格內容查詢篩選

5.3 其它應用

【代碼5.3.1】控制網頁字體大小

【代碼5.3.2】製作網頁選項卡

【5.3.3.1】網頁換膚色,但是刷新後又會重置

【5.3.3.2】網頁換膚色,並且保存Cookie

【代碼】https://github.com/rxbook/study-jquery-1/tree/master/05.Jquery%E8%A1%A8%E5%8D%95%E8%A1%A8%E6%A0%BC%E7%9A%84%E6%93%8D%E4%BD%9C

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章