您好,登錄后才能下訂單哦!
今天小編就為大家帶來一篇怎樣禁止按回車鍵提交表單的文章。小編覺得挺不錯的,為此分享給大家做個參考。一起跟隨小編過來看看吧。
出現自動提交的情況,有兩種可能:
一是編寫了javascript代碼,當用戶點按Enter鍵時,通過js事件偵聽機制觸發表單的提交。
二是利用了瀏覽器的默認行為(至少發現ie是這樣的)。瀏覽器在解析網頁的時候,有許多默認的行為,例如如果一個頁面上有表單和一個提交按鈕,那么打開頁面時,焦點會自動落在這個提交按鈕上面。同樣如果一個表單中只有一個單行文本輸入域(text),那么在這個輸入域中按Enter鍵時,瀏覽器會自動提交該表單。
我們對于第一種情況一般都知道而且很容易理解,但是對于第二種瀏覽器的默認行為,可能知道這一點的人就比較少了,下面我具體看一下瀏覽器(至少ie如此)在表單提交上的默認行為。
如果表單中含有一個單行文本輸入域,那么無論含有多少其他類型的表單組件,那么在該輸入域中點擊Enter時,表單會自動提交。
例如下面的代碼:
<form action="" method="post"
<input type="text"
name="sdfsdf"/
<textarea</textarea
<input type="checkbox"sdfsdf
<input type="hidden"name="aa"/</form
如果表單中含有兩個或多個單行文本輸入域,那么無論是否含有其他類型的表單組件,按Enter鍵時不會自動提交,例如:
<form action="" method="post"
<input type="text"
name="sdfsdf"/
<input type="text"
name="sddf"/</form
辦法很簡單,我們上面舉的例子中已經有了,只要再添加一個文本輸入框就可以了,可能你會說,為了不自動提交就要增加一個沒有用的輸入框,而且中含有兩個輸入框最終用戶會接受嗎?其實可以解決,你可以將那個新添加的輸入框通過style隱藏即可,例如:
<form action="" method="post"
<input type="text" name="notautosubmit"
/
<input type="text"
name="username"/</form
還有一個方法可以綁定button按鈕 enter觸發事件:
document.onkeypress = function(){
if(event.keyCode == 13) {search();returnfalse;}}其中search方法是 name="searchfrom"
以上就是禁止按回車鍵提交表單的方法,內容較為全面,部分代碼是我們日常工作可能會見到或用到的。通過這篇文章,希望你能收獲更多。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。