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

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


当前回答

有点简单

不要按“Enter”键发送表单:

<form id="form_cdb" onsubmit="return false">

按“Enter”键执行功能:

<input type="text" autocomplete="off" onkeypress="if(event.key === 'Enter') my_event()">

其他回答

事件。键=== "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文档

支持的浏览器

在用户定义的函数中使用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 > < /形式

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

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

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

如果你正在使用jQuery:

$('input[type=text]').on('keydown', function(e) {
    if (e.which == 13) {
        e.preventDefault();
    }
});
if(characterCode == 13) {
    // returning false will prevent the event from bubbling up.
    return false; 
} else{
    return true;
}

好的,想象一下你在表单中有以下文本框:

<input id="scriptBox" type="text" onkeypress="return runScript(event)" />

为了在按enter键时从这个文本框运行一些“用户定义的”脚本,而不是让它提交表单,下面是一些示例代码。请注意,这个函数不做任何错误检查,很可能只在IE中工作。要做到这一点,您需要一个更健壮的解决方案,但您将得到大致的想法。

function runScript(e) {
    //See notes about 'which' and 'key'
    if (e.keyCode == 13) {
        var tb = document.getElementById("scriptBox");
        eval(tb.value);
        return false;
    }
}

返回函数的值将提醒事件处理程序不要进一步冒泡事件,并将防止进一步处理按键事件。

注意:

已经指出keyCode现在已弃用。退而求其次的选择也被弃用了。

不幸的是,被现代浏览器广泛支持的标准键在IE和Edge中存在一些不可靠的行为。任何比IE11更老的东西仍然需要填充。

此外,虽然弃用的警告是相当不祥的keyCode和,删除这些将代表一个巨大的突破性的变化,无数的遗留网站。出于这个原因,他们不太可能很快离开任何地方。