我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?
我在调查中使用HTML, PHP 5.2.9和jQuery。
我在一个网站上有一个调查,用户按下回车键(我不知道为什么),不小心没有点击提交按钮就提交了调查(表单),这似乎有些问题。有办法防止这种情况吗?
我在调查中使用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)) { 返回错误; } });
其他回答
不需要阻止用户按Enter键(这似乎不自然),您可以让表单保持原样,并添加一些额外的客户端验证:当调查未完成时,结果不会发送到服务器,用户会收到一条漂亮的消息,告诉需要完成哪些内容才能完成表单。如果您正在使用jQuery,请尝试验证插件:
http://docs.jquery.com/Plugins/Validation
这将需要比捕捉Enter按钮更多的工作,但肯定会提供更丰富的用户体验。
我认为它很好地涵盖了所有的答案,但如果你正在使用一个带有JavaScript验证代码的按钮,你可以将表单的onkeypress设置为Enter来调用你的提交:
<form method="POST" action="..." onkeypress="if(event.keyCode == 13) mySubmitFunction(this); return false;">
onkeypress JS可以是你需要做的任何事情。没有必要进行更大的全球性变革。如果你不是那个从头开始编写应用程序的人,而且你被请去修复别人的网站,而没有把它拆开并重新测试它,这就尤其正确。
给表单一个'javascript:void(0);'的动作似乎可以做到这一点
<form action="javascript:void(0);">
<input type="text" />
</form>
<script>
$(document).ready(function() {
$(window).keydown(function(event){
if(event.keyCode == 13) {
alert('Hello');
}
});
});
</script>
这对我很有用
jQuery.each($("#your_form_id").find('input'), function(){
$(this).bind('keypress keydown keyup', function(e){
if(e.keyCode == 13) { e.preventDefault(); }
});
});
Use:
// Validate your form using the jQuery onsubmit function... It'll really work...
$(document).ready(function(){
$(#form).submit(e){
e.preventDefault();
if(validation())
document.form1.submit();
});
});
function validation()
{
// Your form checking goes here.
}
<form id='form1' method='POST' action=''>
// Your form data
</form>