防止在输入键时提交表单

我有一个带有两个文本框的表单，一个选择下拉框和一个单选按钮。当按下enter键时，我想调用JavaScript函数，但当我按下它时，表单就提交了。

当按下回车键时，如何防止表单被提交?

当前回答

下面是如何使用JavaScript来完成它:

//in your **popup.js** file just use this function var input = document.getElementById("textSearch"); input.addEventListener("keyup", function(event) { event.preventDefault(); if (event.keyCode === 13) { alert("yes it works,I'm happy "); } });  <!DOCTYPE html> <html> <body style="width: 500px"> <input placeholder="Enter the text and press enter" type="text" id="textSearch"/> <script type="text/javascript" src="public/js/popup.js"></script> </body> </html>

2018-06-16 23:04:39

其他回答

<form id="form1" runat="server" onkeypress="return event.keyCode != 13;">

在HTML页面中添加此代码…它会使……输入按钮. .

2019-11-08 06:16:41

在用户定义的函数中使用event.preventDefault()

<form onsubmit="userFunction(event)"> ...

函数userFunction (ev) ｛如果(! event.target.send.checked) ｛ console.log('form NOT submit on "Enter" key') ev.preventDefault (); ｝｝打开chrome控制台>网络选项卡查看 <form onsubmit="userFunction(event)" action="/test.txt"> . <input placeholder="type and press Enter" /><br> . <input type="checkbox" name="send" /> submit on enter > < /形式

2020-07-27 18:43:02

在我看来，一个更简单有效的方法应该是:

function onPress_ENTER()
{
        var keyPressed = event.keyCode || event.which;

        //if ENTER is pressed
        if(keyPressed==13)
        {
            alert('enter pressed');
            keyPressed=null;
        }
        else
        {
            return false;
        }
}

2015-06-07 11:07:37

事件。键=== "Enter"

使用event.key。不再有任意的数字代码!

注意:旧属性(。keyCode和.which)已弃用。

const node = document.getElementsByClassName("mySelect")[0];
node.addEventListener("keydown", function(event) {
    if (event.key === "Enter") {
        event.preventDefault();
        // Do more work
    }
});

现代风格，有lambda和解构

node.addEventListener("keydown", ({key}) => {
    if (key === "Enter") // Handle press
})

Mozilla文档

支持的浏览器

2017-09-14 04:25:36

我使用了document on，它涵盖了页面加载后动态添加的html:

  $(document).on('keydown', '.selector', function (event) {
    if (event.which == 13 || event.keyCode == 13) {
      //do your thang
    }
  });

增加来自@Bradley4的更新

2022-01-01 04:55:06

防止在输入键时提交表单

推荐文章

最新文章

标签