首頁  >  文章  >  web前端  >  詳解JavaScript中submit與button提交表單的差異

詳解JavaScript中submit與button提交表單的差異

黄舟
黄舟原創
2017-07-22 14:03:482648瀏覽

submit是button的一個特例,也是button的一種,它把提交這個動作自動集成了,submit和button,二者都以按鈕的形式展現,看起來都是按鈕,所不同的是type屬性和處發回應的事件上。


     1、 若表單點選提交按鈕後需要用JS處理(包括輸入驗證)後再提交的話,通常都必須把submit改成button,即取消其自動提交的行為,

否則,將會造成提交兩次的效果,對於動態網頁來說,也就是對資料庫操作兩次。或使用submit時驗證時加return true或false。


    2、submit和button,二者都以按鈕的形式展現,看起來都是按鈕,所不同的是type屬性和處發響應的事件上,submit會提交表單,button不會提交表單.

兩者主要差異在於: 
submit預設為form提交,可以提交表單(form). 
button則響應用戶自訂的事件,如果不指定onclick等事件處理函數,它是不做任何事情.當然,button也可以完成表單提交的工作.

INPUT type=submit即傳送表單,按回車提交表單 

INPUT type=button 就是單純的按鈕功能,提交的是innerTEXT 



=== ============submit 和button的詳細比較================================ === 
submit:特殊的button,會自動將表單的資料提交,onClick方法不加return 會自動提交,並不會起到約束的作用, 
所以,使用submit時需要驗證請加return true或false. 
例:

<input type="submit" name="Submit" value="注 册" onClick=" return check();">

,在JS中判斷的時候寫return true; 或return false;

button:普通的按鈕,不會自動提交表單資料.可以在JS中明確提 交:document.form1.submit(),

使用場合: 一個頁面有多個提交按鈕,需要根據使用者的操作來決定到底提交到哪個控制器,這種情況下,就需要在JS中判斷使用者的操作,然後根據操作來給document.form1.action賦值並且document.form1.submit()來提交 

# ===============如果想要所有的提交都在一個servlet中處理,該怎麼做================== 
提交的按鈕也是HTML元件,所以也可以透過getParameter()來得到,那麼getParameter()的參數也需要固定下來 

參數就是所有的表單的提交按鈕的name,當然提交

按鈕的name要一樣才能統一在一個servlet中根據提交按鈕的值來區別操作 

附程式碼: 
##js檔案 


用submit的時候,jsp頁面 


 

用button的時候,jsp程式碼 


############### ###理解:######submit是特殊的button,會直接提交表單,使用button時,不要又onclick函數,才會提交表單。 ###### ###

以上是詳解JavaScript中submit與button提交表單的差異的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn