input輸入框按回車鍵提交表單問題

2021-09-12 17:35:31 字數 878 閱讀 8365

今天發現乙個奇怪的問題,當頁面只有乙個input文字框(type="text")時,將滑鼠焦點置於這個文字框,然後按回車鍵(enter鍵)時會提交表單資料。查了一下,原來這是瀏覽器的預設行為,當form中只有乙個input文字框(type="text")時,使用者按回車鍵會提交這個form表單。從這句話中我們就可以得到產生這種行為的條件就是(1)form中只有乙個文字框。(2)使用者在文字框中按回車鍵。

下面就很清楚了,要解決這個問題,要麼不滿足第乙個條件,即讓form中有多個文字框,要麼不滿足第二個條件,即禁用回車鍵。解決方案如下:

1、保證form表單中不止乙個文字框(建議使用優先順序:高)

那麼我們就可以給form表單中再加入乙個文字框,當然由於加的這個文字框只是乙個標識,所以我們需要把它隱藏,即

2、保證使用者在這個文字框中按回車鍵不起作用

那麼就有2種方式

(1)禁用頁面的回車鍵功能(建議使用優先順序:低)

document.onkeydown = function(e) 

}

但是這種方式會導致整個頁面都不能使用回車鍵(可能其他地方需要用到回車鍵),那麼此時就可以使用下面的方式了。

(2)單獨禁用那乙個文字框的回車鍵功能(建議使用優先順序:中)

function disabletextsubmit(e) 

}

總結:

要解決乙個文字框按回車鍵提交表單的問題,要麼使用方案1,或者使用方案2的第二種方法,如果情況允許也可以使用方案2的第一種方法。當然可能還有其他的解決方案,只要能解決問題,都可以使用。

解決input輸入框按下回車鍵重新整理頁面

input輸入框鍵盤事件按下回車鍵的時候,竟然重新整理了整個頁面,使用者體驗相當不好,原來是form表單提交的時候會重新整理頁面解決方法如下 方法一 form onsubmit return false from 方法二 全域性控制鍵盤按下事件,當鍵碼值為13直接return false docum...

輸入框中按回車相當按TAB(相容多瀏覽器)

最近改乙個網頁在不同瀏覽下不相容問題。原來有個功能,是在輸入框中,按回車相當於tab鍵,到下乙個輸入框。如下,在輸入框的keydown事件中 if event.keycode 13 event.keycode 9 在ie下執行正常,在谷歌下不正常,嘗試了很多種方法,無法模擬鍵盤事件tab 自己估計應...

控制項中按回車鍵就關閉對話方塊問題怎麼解決?

在對話方塊標頭檔案中定義 virtual void onok virtual void oncancel 在.cpp檔案中 過載回車鍵 void cpmagentmanagedlg onok 過載退出鍵 void cpmagentmanagedlg oncancel 如果要是針對某乙個控制項的回車 ...