如何防止在基于web的应用程序中按ENTER键提交表单?


当前回答

I Have come across this myself because I have multiple submit buttons with different 'name' values, so that when submitted they do different things on the same php file. The enter / return button breaks this as those values aren't submitted. So I was thinking, does the enter / return button activate the first submit button in the form? That way you could have a 'vanilla' submit button that is either hidden or has a 'name' value that returns the executing php file back to the page with the form in it. Or else a default (hidden) 'name' value that the keypress activates, and the submit buttons overwrite with their own 'name' values. Just a thought.

其他回答

如何:

<asp:Button ID="button" UseSubmitBehavior="false"/>

另一种方法是仅在表单应该提交时才将提交输入按钮附加到表单,并在表单填充期间将其替换为简单的div

我认为,你可以在javascript的表单中捕获键下,防止冒泡。网页上的ENTER基本上只是提交当前所选控件所在的表单。

以下是我的做法:

window.addEventListener('keydown', function(event)
{
    if (event.key === "Enter" && event.target.tagName !== 'TEXTAREA')
    {
        if(event.target.type !== 'submit')
        {
            event.preventDefault();
            return false;
        }
    }
});

简而言之,纯Javascript的答案是:

<script type="text/javascript">
    window.addEventListener('keydown', function(e) {
        if (e.keyIdentifier == 'U+000A' || e.keyIdentifier == 'Enter' || e.keyCode == 13) {
            if (e.target.nodeName == 'INPUT' && e.target.type == 'text') {
                e.preventDefault();
                return false;
            }
        }
    }, true);
</script>

这只会禁用input type='text'的"Enter"键动作。访问者仍然可以在整个网站上使用“Enter”键。

如果你想在其他操作中禁用“Enter”,你可以添加console.log(e);为了你的测试目的,在chrome中按F12,进入“控制台”选项卡,点击页面上的“backspace”,看看里面返回了什么值,然后你可以针对所有这些参数来进一步增强上面的代码,以满足你对“e.t target”的需求。节点名”、“e。target。键入”和更多…

在这里可以看到我对类似问题的详细回答