猿问

通过点击Enter阻止用户提交表单

通过点击Enter阻止用户提交表单

我有一个网站上的调查,似乎有一些问题,用户点击Enter(我不知道为什么)和意外提交调查(表单),而没有点击提交按钮。有办法防止这种情况发生吗?

我在调查中使用了HTML、PHP5.2.9和jQuery。


慕姐8265434
浏览 650回答 4
4回答

长风秋雁

您可以使用如下方法$(document).ready(function() {   $(window).keydown(function(event){     if(event.keyCode == 13) {       event.preventDefault();       return false;     }   });});在阅读原文评论时,使其更实用,并允许人们按下进入如果它们已完成所有字段:function validationFunction() {   $('input').each(function() {     ...   }   if(good) {     return true;   }   return false;}$(document).ready(function() {   $(window).keydown(function(event){     if( (event.keyCode == 13) && (validationFunction() == false) ) {       event.preventDefault();       return false;     }   });});

慕后森

不允许输入键在任何地方如果你没有<textarea>在您的表单中,只需将以下内容添加到您的<form>:<form&nbsp;...&nbsp;onkeydown="return&nbsp;event.key&nbsp;!=&nbsp;'Enter';">或者使用jQuery:$(document).on("keydown",&nbsp;"form",&nbsp;function(event)&nbsp;{&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;event.key&nbsp;!=&nbsp;"Enter";});这将导致表单中的每个键按下将在key。如果不是Enter,然后它会回来true一切照常进行。如果是的话Enter,然后它会回来false任何事情都会立即停止,所以表格不会提交。这个keydown事件优先于keyup就像keyup阻止表单提交为时已晚。历史上也有keypress,但这是不可取的,正如KeyboardEvent.keyCode。你应该用KeyboardEvent.key相反,它返回按下的键的名称。什么时候Enter则会检查13(正常输入)和108(数字输入)。请注意$(window)就像其他一些答案中所建议的,而不是$(document)不起作用keydown/keyup在IE<=8中,如果您也想覆盖那些可怜的用户,这不是一个好的选择。只允许在文本区域上输入键如果你有<textarea>以你的形式(当然应(接受Enter键),然后将keydown处理程序添加到每个不是<textarea>.<input&nbsp;...&nbsp;onkeydown="return&nbsp;event.key&nbsp;!=&nbsp;'Enter';"><select&nbsp;...&nbsp;onkeydown="return&nbsp;event.key&nbsp;!=&nbsp;'Enter';">...要减少样板,最好使用jQuery:$(document).on("keydown",&nbsp;":input:not(textarea)",&nbsp;function(event)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;event.key&nbsp;!=&nbsp;"Enter";});如果在这些输入元素上附加了其他事件处理程序函数(出于某种原因您也希望在Enter键上调用这些函数),那么只会阻止事件的默认行为,而不是返回false,这样它就可以正确地传播到其他处理程序。$(document).on("keydown",&nbsp;":input:not(textarea)",&nbsp;function(event)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;if&nbsp;(event.key&nbsp;==&nbsp;"Enter")&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;event.preventDefault(); &nbsp;&nbsp;&nbsp;&nbsp;}});允许在文本区域上输入键并仅提交按钮如果要允许提交按钮上的Enter键<input|button type="submit">同样,您也可以按照下面的方式对选择器进行细化。$(document).on("keydown",&nbsp;":input:not(textarea):not(:submit)",&nbsp;function(event)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;...});请注意input[type=text]正如其他一些答案所建议的,不包括HTML 5的非文本输入,所以这不是一个好的选择器。

泛舟湖上清波郎朗

为了防止提交表单,我必须捕获与按下键有关的所有三个事件:&nbsp;&nbsp;&nbsp;&nbsp;var&nbsp;preventSubmit&nbsp;=&nbsp;function(event)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(event.keyCode&nbsp;==&nbsp;13)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;console.log("caught&nbsp;ya!"); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;event.preventDefault(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;//event.stopPropagation(); &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;return&nbsp;false; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;$("#search").keypress(preventSubmit); &nbsp;&nbsp;&nbsp;&nbsp;$("#search").keydown(preventSubmit); &nbsp;&nbsp;&nbsp;&nbsp;$("#search").keyup(preventSubmit);您可以将上述所有内容组合成一个很好的紧凑版本:&nbsp;&nbsp;&nbsp;&nbsp;$('#search').bind('keypress&nbsp;keydown&nbsp;keyup',&nbsp;function(e){ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;if(e.keyCode&nbsp;==&nbsp;13)&nbsp;{&nbsp;e.preventDefault();&nbsp;} &nbsp;&nbsp;&nbsp;&nbsp;});

一只名叫tom的猫

如果使用脚本执行实际提交,则可以在onSubmit处理程序中添加“返回false”行,如下所示:<form&nbsp;onsubmit="return&nbsp;false;">从JavaScript调用表单上的Submit()不会触发事件。
随时随地看视频慕课网APP
我要回答