form自动提交的理解

出现自动提交的情况

1. 单个输入框.

   1. 没有按钮,
   2. 不管按钮的type=”botton | submit”,

   3. 以上两种情况,回车即提交.

      <form id="inputForm" action="www.baidu.com" method="post">
         <input type="text" id="oderId" name="name" placeholder="请输入运单号">
         <button type="button">查询</button> <!--或者<button type="submit">查询</button>-->
      </form>

2. 当type=”submit”时，无论有几个type=”text”输入框，回车均表示提交。

   <form id="inputForm" action="www.baidu.com" method="post">
       <input type="text" id="oderId" name="name" placeholder="请输入运单号">
       <input type="text" id="name" name="oderId" placeholder="请输入运单号">
       <button type="submit">查询</button>
   </form>

3. 当type=”button”时，且存在多个输入框，回车不提交。

   <form id="inputForm" action="www.baidu.com" method="post">
       <input type="text" id="name" name="name" placeholder="请输入运单号">
       <input type="text" id="oderId" name="oderId" placeholder="请输入运单号">
       <button type="button">查询</button>
   </form>

解决方法

1. 解决单个输入框的回车即提交问题，可以增加一个隐藏的input=”text” display=’none’; 然后type类型为button。

   <form id="inputForm" action="www.baidu.com" method="post">
       <input type="text" id="name" name="name" placeholder="请输入运单号">
       <input type="text" styly="display:none;" id="oderId" name="oderId" placeholder="请输入运单号">
       <button type="button">查询</button>
   </form>

2. 在form表单或input中加入：οnkeydοwn=”if(event.keyCode==13){return false;}”

   <form id="inputForm" action="www.baidu.com" method="post" onkeydown="if(event.keyCode==13){return false;}">
       <input type="text" id="name" name="name" placeholder="请输入运单号">
       <input type="text" id="oderId" name="oderId" placeholder="请输入运单号">
       <button type="submit">查询</button>
   </form>

原文地址

http://blog.csdn.net/ligang2585116/article/details/44699567