禁止按回车键提交表单的方法
更新时间：2015年06月11日 12:10:48 投稿：hebedich
这篇文章主要介绍了禁止按回车键提交表单的方法的相关资料,需要的朋友可以参考下
出现自动提交的情况，有两种可能：
一是编写了javascript代码，当用户点按Enter键时，通过js事件侦听机制触发表单的提交。
二是利用了浏览器的默认行为（至少发现ie是这样的）。浏览器在解析网页的时候，有许多默认的行为，例如如果一个页面上有表单和一个提交按钮，那么打开页面时，焦点会自动落在这个提交按钮上面。同样如果一个表单中只有一个单行文本输入域（text），那么在这个输入域中按Enter键时，浏览器会自动提交该表单。
我们对于第一种情况一般都知道而且很容易理解，但是对于第二种浏览器的默认行为，可能知道这一点的人就比较少了，下面我具体看一下浏览器（至少ie如此）在表单提交上的默认行为。
如果表单中含有一个单行文本输入域，那么无论含有多少其他类型的表单组件，那么在该输入域中点击Enter时，表单会自动提交。
例如下面的代码：
<form action="" method="post"> <input type="text" name="sdfsdf"/> <input type="checkbox">sdfsdf <input type="hidden"name="aa"/></form>
如果表单中含有两个或多个单行文本输入域，那么无论是否含有其他类型的表单组件，按Enter键时不会自动提交，例如：
<form action="" method="post" <input type="text" name="sdfsdf"/ <input type="text" name="sddf"/</form
办法很简单，我们上面举的例子中已经有了，只要再添加一个文本输入框就可以了，可能你会说，为了不自动提交就要增加一个没有用的输入框，而且中含有两个输入框最终用户会接受吗？其实可以解决，你可以将那个新添加的输入框通过style隐藏即可，例如：
<form action="" method="post" <input type="text" name="notautosubmit" style="display:none"/ <input type="text" name="username"/</form
还有一个方法可以绑定button按钮 enter触发事件：
document.onkeypress = function(){
if(event.keyCode == 13) {search();returnfalse;}}其中search方法是onclick事件：<form name="searchfrom"
最终解决方案：
<script language="javascript">
function defineSubmit(btn)
{
if("submit1" == btn.value)
{
document.testForm.action="firstAction";
}
else
{
document.testForm.action="secondAction";
}
document.testForm.submit();
}
</script>
<form name="testForm" method="post">
username:<input type="text" name="username"/>
password:<input type="password" name="password"/>
<input type="button" name="submitName" onclick="defineSubmit(this)" value="submit1"/>
<input type="button" name="submitName" onclick="defineSubmit(this)" value="submit2"/>
</form>
相关文章
本文主要介绍了强大的JSON.stringify如何使用，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-06-06
这篇文章主要介绍了js为空或不是对象问题的快速解决方法。需要的朋友可以过来参考下，希望对大家有所帮助2013-12-12
DHTML 中的绝对定位...2006-11-11
这篇文章主要介绍了JS开发自己的类库,结合实例形式分析了javascript开发类库的原理、组成及实现方法,需要的朋友可以参考下2019-08-08
给一个文字，对输出的文字进行截取，保留400个字符,其中对url的保留比较麻烦，尤其是有两个相同url时不能采用indexOf获取其字符位置2012-01-01
这篇文章主要介绍了JS 实现导航菜单中的二级下拉菜单的几种方式的相关资料,这里提供了三种方式，和实例代码，需要的朋友可以参考下2016-10-10
微信小程序是不能直接连接数据库进行数据操作的,这是出于安全的考虑,下面这篇文章主要给大家介绍了关于微信小程序连接MySQL数据库的全过程,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2022-01-01
这篇文章主要介绍了比例尺、缩略图、平移缩放之百度地图添加控件方法,大家都知道百度地图API中提供了丰富的控件，您还可以通过Control类来实现自定义控件，需要的朋友可以参考下2015-08-08
这篇文章主要为大家详细介绍了小程序实现好看的分类页，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-07-07
都说 JavaScript 是一种很灵活的语言，这其实也可以说它是一个混乱的语言。它把函数式编程和面向对象编程糅合一起，再加上动态语言特性，简直强大无比，下面小编给大家介绍Javascript中this详解，需要的小伙伴可以来参考下2015-09-09
最新评论