我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?

我在调查中使用HTML, PHP 5.2.9和jQuery。


当前回答

这里已经有很多好的答案,我只是想从用户体验的角度贡献一些东西。键盘控件在表单中非常重要。

问题是如何在按回车键时禁用提交。而不是如何在整个应用程序中忽略Enter。因此,考虑将处理程序附加到表单元素,而不是窗口。

禁用Enter表单提交仍然允许以下:

当提交按钮被聚焦时,通过输入提交表单。 填充所有字段时提交表单。 通过Enter与非提交按钮交互。

这只是一个样板,但它符合所有三个条件。

$(“形式”)。On ('keypress',函数(e) { //注册按键。 $attr = $(e.target).attr('type'); $node = e.target.nodeName.toLowerCase(); if ($ attr = = =“按钮”| | $ attr = = = '提交' | | $ node = = =“文本区域”){ 返回true; } //如果没有填充所有字段,则忽略按键。 if (e.which === 13 && ! fieldsarepopulate (this)) { 返回错误; } });

其他回答

禁止在任何地方输入键

如果你的表单中没有<textarea>,那么只需将以下内容添加到你的<form>:

<form ... onkeydown="return event.key != 'Enter';">

或者使用jQuery:

$(document).on("keydown", "form", function(event) { 
    return event.key != "Enter";
});

这将导致表单内的每一次按键都将在该键上进行检查。如果它不是Enter,那么它将返回true,一切照常进行。如果它是Enter,那么它将返回false,任何事情都将立即停止,因此表单将不会提交。

keydown事件优先于keyup事件,因为keyup事件太晚而无法阻止表单提交。历史上也有按键,但这已弃用,KeyboardEvent.keyCode也是如此。你应该使用KeyboardEvent。键,返回所按键的名称。当选中Enter时,这将检查13(正常输入)和108 (numpad输入)。

请注意,在其他一些答案中建议的$(window)而不是$(document)在IE<=8中的keydown/keyup中不起作用,所以如果你想覆盖那些贫穷的用户,这不是一个好的选择。

只允许在文本区域输入键

如果你在你的表单中有一个<textarea>(当然应该接受Enter键),然后添加keydown处理程序到每个不是<textarea>的单独输入元素。

<input ... onkeydown="return event.key != 'Enter';">
<select ... onkeydown="return event.key != 'Enter';">
...

为了减少样板文件,最好使用jQuery:

$(document).on("keydown", ":input:not(textarea)", function(event) {
    return event.key != "Enter";
});

如果在这些输入元素上附加了其他事件处理程序函数,出于某种原因也想在enter键上调用这些函数,那么只防止事件的默认行为,而不是返回false,这样它就可以正确地传播到其他处理程序。

$(document).on("keydown", ":input:not(textarea)", function(event) {
    if (event.key == "Enter") {
        event.preventDefault();
    }
});

允许输入键在文本区域和提交按钮

如果你想允许提交按钮上的输入键<input|button type="submit">,那么你总是可以像下面那样细化选择器。

$(document).on("keydown", ":input:not(textarea):not(:submit)", function(event) {
    // ...
});

请注意,在其他一些答案中建议的输入[type=text]不包括那些HTML5非文本输入,所以这不是一个好的选择器。

$(document).on("keydown","form", function(event)
{
   node = event.target.nodeName.toLowerCase();
   type = $(event.target).prop('type').toLowerCase();

   if(node!='textarea' && type!='submit' && (event.keyCode == 13 || event.keyCode == 169))
   {
        event.preventDefault();
        return false;
    }
});

它工作得很完美!

进入你的css,把它添加进去,然后会自动阻止公式的提交,只要你有提交输入,如果你不再需要它,你可以删除它,或者输入activate和deactivate

 input:disabled {
        background: gainsboro;
      }
      input[value]:disabled {
        color: whitesmoke;
      }

Use:

$(document).on('keyup keypress', 'form input[type="text"]', function(e) {
  if(e.keyCode == 13) {
    e.preventDefault();
    return false;
  }
});

这个解决方案适用于网站上的所有表单(也适用于使用Ajax插入的表单),只防止输入文本中的enter。把它放在文档就绪函数中,然后永远忘记这个问题。

这是完美的方式,你不会从你的页面重定向

$('form input').keydown(function (e) {
if (e.keyCode == 13) {
    e.preventDefault();
    return false;
}
});