新聞中心
[[415013]]

創(chuàng)新互聯(lián)于2013年開始,是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司,擁有項目網(wǎng)站設(shè)計、成都網(wǎng)站建設(shè)網(wǎng)站策劃,項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命,1280元新建做網(wǎng)站,已為上家服務(wù),為新建各地企業(yè)和個人服務(wù),聯(lián)系電話:18980820575
大家好,我進(jìn)階學(xué)習(xí)者。
一、前言
提交表單時,會觸發(fā) submit 事件,它通常用于在將表單發(fā)送到服務(wù)器之前對表單進(jìn)行校驗,或者中止提交,并使用 JavaScript 來處理表單。
form.submit() 方法允許從 JavaScript 啟動表單發(fā)送??梢允褂么朔椒▌討B(tài)地創(chuàng)建表單,并將其發(fā)送到服務(wù)器。
二、事件:submit
1. 提交表單主要有兩種方式。
第一種 :
點(diǎn)擊 或 ,
第二種 :在 input 字段中按下 Enter 鍵。
這兩個行為都會觸發(fā)表單的 submit 事件。
處理程序可以檢查數(shù)據(jù),如果有錯誤,就顯示出來,并調(diào)用 event.preventDefault(),這樣表單就不會被發(fā)送到服務(wù)器了。
案例:
在文本字段中按下 Enter 鍵。點(diǎn)擊 。
這兩種行為都會顯示 alert,而因為代碼中的 return false,表單不會被發(fā)送到別處。
- First: Enter in the input field
- Second: Click "submit":
2. submit 和 click 的關(guān)系
在輸入框中使用 Enter 發(fā)送表單時,會在 上觸發(fā)一次 click 事件。
這很有趣,因為實際上根本沒有點(diǎn)擊。
例 :
三、方法:submit
如果要手動將表單提交到服務(wù)器,可以調(diào)用 form.submit()。
這樣就不會產(chǎn)生 submit 事件。這里假設(shè)如果開發(fā)人員調(diào)用 form.submit(),就意味著此腳本已經(jīng)進(jìn)行了所有相關(guān)處理。
有時該方法被用來手動創(chuàng)建和發(fā)送表單,如下所示:
運(yùn)行結(jié)果:
重置表單
為< input >或< button >標(biāo)簽設(shè)置type=“reset"屬性可以定義重置按鈕。
當(dāng)單擊重置按鈕時,表單將被重置,所有表單字段恢復(fù)為初始值。這是會觸發(fā)reset事件。1
例:單擊【重置】按鈕,彈出提示,恢復(fù)文本框默認(rèn)值。
運(yùn)行結(jié)果:
注:
在提交表單禁用提交按鈕的時候,應(yīng)該在“submit”事件添加事件處理函數(shù)。不要用click。
因為不同的瀏覽器存在時差,有的瀏覽器會在觸發(fā)表單的submit事件之前觸發(fā)click事件,有的在這之后。
四、總結(jié)
本文基于JavaScript基礎(chǔ),介紹了 事件和方法提交, submit 和 click 的關(guān)系對比。通過案例的分析,在實際應(yīng)用需要注意的點(diǎn),遇到的問題,提供有效的解決方案。
歡迎大家積極嘗試,有時候看到別人實現(xiàn)起來很簡單,但是到自己動手實現(xiàn)的時候,總會有各種各樣的問題,切勿眼高手低,勤動手,才可以理解的更加深刻。
代碼很簡單,希望對你學(xué)習(xí)有幫助。
本文轉(zhuǎn)載自微信公眾號「前端進(jìn)階學(xué)習(xí)交流」,可以通過以下二維碼關(guān)注。轉(zhuǎn)載本文請聯(lián)系前端進(jìn)階學(xué)習(xí)交流公眾號。
文章標(biāo)題:盤點(diǎn)JavaScript事件和方法提交那些事兒
本文網(wǎng)址:http://www.5511xx.com/article/cdgdeih.html


咨詢
建站咨詢
