jQuery清除表單資料程式碼例項
清除表單中的資料最簡單的方法,就是點選重置按鈕實現清空效果,但是在實際應用中可能需要根據程式碼的具體執行情況來清除表單中的資料,下面就分享一段能夠實現此功能的jQuery程式碼。
[JavaScript] 純文字檢視 複製程式碼function clearForm(form) { $(':input', form).each(function() { var type = this.type; var tag = this.tagName.toLowerCase(); if (type == 'text' || type == 'password' || tag == 'textarea') this.value = ""; else if (type == 'checkbox' || type == 'radio') this.checked = false; else if (tag == 'select') this.selectedIndex = -1; }); };
以上程式碼實現了我們的要求,下面對程式碼做一下簡單註釋。
一.程式碼註釋:
1.function clearForm(form) {},引數為表單物件。
2.$(':input', form).each(function() {}),遍歷表單中的每一個input元素。
3.var type = this.type,獲取input元素的type屬性值。
4.var tag = this.tagName.toLowerCase(),獲取標籤名稱並且將標籤名轉換為小寫。
5.if (type == 'text' || type == 'password' || tag == 'textarea') this.value = "",如果input元素的型別為文字或者密碼框或者標籤為多行文字框,就將value屬性值設定為空。
6.else if (type == 'checkbox' || type == 'radio') this.checked = false,如果為單選框或者核取方塊,那麼就取消選中。
7.else if (tag == 'select') this.selectedIndex = -1,如果是select下拉選單,就取消選中項。
相關文章
- jQuery點選文字框清除內容程式碼例項jQuery
- JavaScript 表單驗證程式碼例項JavaScript
- jQuery.map()方法程式碼例項jQuery
- jQuery tab選項卡效果程式碼例項jQuery
- jQuery利用name匹配元素程式碼例項jQuery
- jquery.idTabs.min.js選項卡程式碼例項jQueryJS
- jQuery點選滑出層效果程式碼例項jQuery
- jQuery table表格隔行換色程式碼例項jQuery
- jQuery遍歷array陣列元素程式碼例項jQuery陣列
- ajax讀取資料庫資料程式碼例項資料庫
- jQuery 例項jQuery
- jQuery控制div顯示和隱藏程式碼例項jQuery
- table表頭分組程式碼例項
- PHP 完整表單例項PHP單例
- HTML 使用表單標籤實現註冊頁面的例項程式碼HTML
- 淡入淡出效果簡單程式碼例項
- jQuery記住使用者名稱和密碼效果程式碼例項jQuery密碼
- jQuery Ajax 例項 全解析jQuery
- dom操作程式碼例項
- css梯形程式碼例項CSS
- html實現簡單ListViews效果的例項程式碼HTMLView
- Python訪問小程式簡單方法程式碼例項詳解Python
- 例項QT程式 —— Qt單例不規則介面程式QT單例
- 19C 單例項資料庫安裝單例資料庫
- Oracle 資料庫巡檢指令碼 單例項 RAC 輸出HTML格式Oracle資料庫指令碼單例HTML
- PHP+jQuery開發簡單的翻牌抽獎例項PHPjQuery
- CSS3立體導航選單程式碼例項CSSS3
- JavaScript in運算子程式碼例項JavaScript
- 設計模式例項程式碼設計模式
- table表格美化程式碼例項
- jQuery tab選項卡程式碼詳解jQuery
- 純css tab選項卡程式碼例項CSS
- Oracle 11G資料庫單例項安裝Oracle資料庫單例
- 透過程式碼例項簡單瞭解Python sys模組Python
- 簡單介紹正規表示式拆分url例項程式碼
- python 單一程式例項 實現Python
- canvas刮刮樂程式碼例項Canvas
- canvas載入效果程式碼例項Canvas
- CSS空心箭頭程式碼例項CSS