對(duì)于Form表單reset方法的新認(rèn)識(shí)
更新時(shí)間：2014年03月05日 16:36:24 作者：
HTML中Form表單的reset方法被用來(lái)清空用戶(hù)所輸入的內(nèi)容，以前一直誤以為其是單純的將input等輸入項(xiàng)中的值清空
HTML中Form表單的reset方法被用來(lái)清空用戶(hù)所輸入的內(nèi)容，以前一直誤以為其是單純的將input等輸入項(xiàng)中的值清空。
但實(shí)際上不是這樣的，reset方法的本質(zhì)是將input等輸入項(xiàng)中的內(nèi)容還原為屬性value中的值，而不是“”空值。
w3c上是這樣說(shuō)的：
在 HTML 表單中 <input type="reset"> 標(biāo)簽每出現(xiàn)一次，一個(gè) Reset 對(duì)象就會(huì)被創(chuàng)建。
當(dāng)重置按鈕被點(diǎn)擊，包含它的表單中所有輸入元素的值都重置為它們的默認(rèn)值。默認(rèn)值由 HTML value 屬性或 JavaScript 的 defaultValue 屬性指定。
在實(shí)際情況中，我們經(jīng)常需要在編輯某個(gè)內(nèi)容的時(shí)候?qū)崿F(xiàn)表單reset，但是這個(gè)時(shí)候input等輸入項(xiàng)的value屬性可能已經(jīng)被賦予了值，所以reset只是讓表單初始化為這個(gè)值。
在這種情況下，我們只能通過(guò)javascript去將input等輸入項(xiàng)的value屬性設(shè)置為空來(lái)達(dá)到reset的效果。
但實(shí)際上不是這樣的，reset方法的本質(zhì)是將input等輸入項(xiàng)中的內(nèi)容還原為屬性value中的值，而不是“”空值。
w3c上是這樣說(shuō)的：
在 HTML 表單中 <input type="reset"> 標(biāo)簽每出現(xiàn)一次，一個(gè) Reset 對(duì)象就會(huì)被創(chuàng)建。
當(dāng)重置按鈕被點(diǎn)擊，包含它的表單中所有輸入元素的值都重置為它們的默認(rèn)值。默認(rèn)值由 HTML value 屬性或 JavaScript 的 defaultValue 屬性指定。
在實(shí)際情況中，我們經(jīng)常需要在編輯某個(gè)內(nèi)容的時(shí)候?qū)崿F(xiàn)表單reset，但是這個(gè)時(shí)候input等輸入項(xiàng)的value屬性可能已經(jīng)被賦予了值，所以reset只是讓表單初始化為這個(gè)值。
在這種情況下，我們只能通過(guò)javascript去將input等輸入項(xiàng)的value屬性設(shè)置為空來(lái)達(dá)到reset的效果。
相關(guān)文章
在JavaScript中，有3個(gè)關(guān)鍵字可以聲明變量：var、const和let，其中var在ECMAScript的所有版本中都可以使用，而const和let只能在ECMAScript 6及更晚的版本中使用，本文就來(lái)說(shuō)說(shuō)二者的區(qū)別，感興趣的可以了解一下2022-11-11
JavaScript iframe數(shù)據(jù)共享接口實(shí)現(xiàn)方法
在iframe與父窗口或者與子窗口傳遞數(shù)據(jù)是一個(gè)麻煩的事情，如果我們能夠?qū)懸粋€(gè)一勞永逸的接口那就再方便不過(guò)了，下面就來(lái)簡(jiǎn)答介紹一下如何實(shí)現(xiàn)此功能，對(duì)js iframe相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-01-01
js中獲取jsp表單中radio類(lèi)型的值簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇js中獲取jsp表單中radio類(lèi)型的值簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-08-08
webpack5的loader配置小白學(xué)習(xí)篇
這篇文章主要為大家介紹了webpack5的loader配置非常適合webpack入門(mén)的小白學(xué)習(xí)，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-05-05
這篇文章主要為大家詳細(xì)介紹了原生JS封裝vue Tab切換效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-04-04
uniApp獲取當(dāng)前位置經(jīng)緯度的示例代碼
這篇文章主要介紹了uniApp獲取當(dāng)前位置經(jīng)緯度,以下是使用uni.getLocation獲取當(dāng)前位置的示例代碼,需要的朋友可以參考下2024-01-01
JS模仿手機(jī)端九宮格登錄功能實(shí)現(xiàn)代碼
這篇文章主要介紹了JS模仿手機(jī)端九宮格登錄功能實(shí)現(xiàn)代碼的相關(guān)資料,需要的朋友可以參考下2016-04-04
js獲取對(duì)象,數(shù)組所有屬性鍵值(key)和對(duì)應(yīng)值(value)的方法示例
這篇文章主要介紹了js獲取對(duì)象,數(shù)組所有屬性鍵值(key)和對(duì)應(yīng)值(value)的方法,涉及javascript對(duì)于對(duì)象、數(shù)組鍵名與鍵值遍歷相關(guān)操作技巧,需要的朋友可以參考下2019-06-06
在LayUI圖片上傳中,解決由跨域問(wèn)題引起的請(qǐng)求接口錯(cuò)誤的方法
今天小編就為大家分享一篇在LayUI圖片上傳中,解決由跨域問(wèn)題引起的請(qǐng)求接口錯(cuò)誤的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
本文為大家介紹下前臺(tái)js調(diào)用后臺(tái)方法，下面有個(gè)不錯(cuò)的示例，喜歡的朋友可以參考下2013-12-12