表單防止自動提交及onSubmit解析

form自動提交是指按回車鍵後,自動提交表單,爲防止自動提交表單,可以在<form>標籤中添加事件屬性onSubmit = "return false",這樣回車提交表單就不會起作用了。
現在對自動提交表單的情形作一下測試:
1.
<form id="frm1" action="http://www.sohu.com">
username: <input type="text" name="username"/>
</form>
這種情況會自動提交表單,但是加上onSubmit="return false"之後,就不會了。這是最典型的情況
2.表單中有多個文本框
<form id = "frm" action="http://www.baidu.com">
username: <input type="text" name="username"/>
password: <input type="text" name="password"/>
</form>
這樣的情況就不能自動提交表單了,我想是因爲有多個文本框的原因,可是如果把其中一個input換成hidden,則就可以自動提交表單了。
3.多個表單同時存在的情況
<form id = "frm" action="http://www.baidu.com">
username: <input type="text" name="username"/>
password: <input type="text" name="password"/>
</form>
<form id="frm1" action="http://www.sohu.com">
username: <input type="text" name="username"/>
</form>
這樣的情況只有第二個才能自動提交,第一個則不能。看來依然是隻有一個文本框的可以提交。
4.在表單中加上onSubmit="return false"和submit按鈕後,發現點擊submit按鈕也不可以提交,看來加上onSubmit之後,裏面的必須要return true,纔可以跳轉,onSubmit的值一定要加return,否則都當return true來處理
5.如果添加submit按鈕後,則回車等於單擊submit,除非加上onSubmit="return false",才能禁止提交

6.提交按鈕類型是button則不能提交表單,可以加上οnclick="方法名"事件屬性,來執行某個js方法,達到提交表單的目的。

7.如果有onSubmit屬性,則只有當onSubmit值爲true時,纔會跳轉到action的路徑

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章