HTML防止input回車提交表單


原鏈接:https://blog.csdn.net/ligang2585116/article/details/44699567

 

自動提交情況說明:

1.默認情況下,單個輸入框,無論按鈕的type="submit"還是type="button"類型,回車即提交。
2.當type="submit"時,無論有幾個type="text"輸入框,回車均表示提交。(<button>按鈕默認的type為submit)
3.當type="button"時,且存在多個輸入框,回車不提交。(button)

解決方案:
1.解決單個輸入框的回車即提交問題,可以增加一個隱藏的input="text" display='none'; 然后type類型為button。
2.在form表單或input中加入:onkeydown="if(event.keyCode==13){return false;}"

 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>

<body>
    <form action="www.baidu.com" method="post" onkeydown="if(event.keyCode==13){return false;}">
        <input type="text" value="" />
        <input type="text" value="" />
        <button>提交</button>
        <!-- 或在對應input上添加,同時建議取消自動填充,因為mac下會有問題<input type="text" value="" autocomplete="off" onkeydown="if(event.keyCode==13){return false;}" /> -->
    </form>
</body>

</html>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM