码迷,mamicode.com
首页 > Web开发 > 详细

解决jquery使用ajax提交button标签时重复提交了。

时间:2015-01-08 15:14:49      阅读:193      评论:0      收藏:0      [点我收藏+]

标签:jquery   ajax   重复提交   

这几天遇到一个jquery的ajax问题。相关代码是
<form action="xxx" method="post">
<button type="submit" class="tijiao">提交</button>
</form>




js为
$(".tijiao").click(function(){
  $.post(xxx, $('.alert-form').serialize(), function(result){})
})


在chrome下只发送一次请求,但是在firefox下竟然发送了两次,一次是ajax一次是正常的post。
最后到网上查了下资料。原来firefox将button标签视为input,上述代码的效果相当于如下:
<form action="xxx" method="post">
<input type="submit" class="tijiao" value="提交"/>
</form>


运行的效果就是ajax数据之后,浏览器的submit又post了一次从而阻塞了ajax的请求。导致ajax收不到返回的数据。
解决办法:


将button标签干脆改成input type属性改成button,不能用submit属性。
代码如下
<form action="xxx" method="post">
<input type="button" class="tijiao" value="提交"/>
</form>


解决jquery使用ajax提交button标签时重复提交了。

标签:jquery   ajax   重复提交   

原文地址:http://blog.csdn.net/jackdowson123/article/details/42525173

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!