阻止点击回车提交表单简单方法分享

阻止点击回车提交表单简单方法分享:
有时候在填写表单的时候,一不小心点击回车就会发生表单提交动作,这往往不是我们想要的结果,所以有时候要阻止点击回车提交表单这个动作,当然方法有很多,下面就分享一个比较简单的方式。
先看一段会出现点击回车提交表单的代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
</head> 
<body> 
<form action="http://www.softwhy.com"> 
  <input type="text" name="username"/> 
  <input type="submit" value="提交"/> 
</form> 
</body> 
</html>

在以上代码中,在文本框输入文本,并且焦点还表单之中的时候,点击回车会出现表单提交效果,代码修改如下:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
</head> 
<body> 
<form action="http://www.softwhy.com"> 
  <input type="text" name="username"/> 
  <input type="text" style='display:none' /> 
  <input type="submit" value="提交"/> 
</form> 
</body> 
</html>

只要将表单再添加一个施加display:none文本框就可以阻止点击回车提交表单的效果。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=11789

更多内容可以参阅:http://www.softwhy.com/divcss/

你可能感兴趣的:(阻止点击回车提交表单简单方法分享)