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