Ajax提交了两次，但我只点击一次啊

Posted 2021-04-15 JAVA小咖秀

链接：https://my.oschina.net/u/344631/blog/1581993

前台页面:

 
   
   
 

  
    
    
  <form id="uploadForm" method="POST" action="actionUrl">
  
    
    
  
   
  
    
    
  <input type="text" id="yourName" />
  
    
    
  
   
  
    
    
  <%--重点来了,注意这个button--%>
  
    
    
  
   
  
    
    
  <button id="btnOk" onclick="submitClick()">submit
  
    
    
  </button>
  
    
    
  

  
    
    
  </form>
  
    
    
  

 
   
   
 

问题:一般情况下,我们都使用按钮提交. 如果使用AJAX提交时发现点一次按钮, 却发生2次提交, 那么估计是按钮没有设置type="button".

分析:w3school关于html<button>标签的介绍：
定义和用法: type 属性规定按钮的类型。

提示：请始终为按钮规定 type 属性。Internet Explorer 的默认类型是 "button"，而其他浏览器中（包括 W3C 规范）的默认值是 "submit"。(http://www.w3school.com.cn/tags/att_button_type.asp)

所以原因是:当使用遵守W3C 规范的浏览器时,submit表单按钮提交了一次, ajax代码提交了一次.

解决:按钮加入type属性就可以了:

 
   
   
 

  
    
    
  <button id="btnOk" type="button" onclick="submitClick()">submit
  
    
    
  </button>
 
   
   
 

 

近期文章推荐

扫描二维码

获取更多精彩

Java小咖秀

你点的每个好看，我都认真当变成喜欢