解决火狐浏览器发送jquery的ajax请求无效的问题

今天遇到这样一个问题：
页面在chrome下发送ajax的请求是没有问题的，但是在firfox下无效。

代码大致如下：

//前面省略
<form>
.....
<button class="btn btn-primary" onclick="generateScore(this);"><i class="fa fa-random">i> 生成成绩button>
<button class="btn btn-primary" type="submit"><i class="fa fa-search">i> 查询成绩button>
......
form>
......
<script>
    function generateScore(obj) {
        
        $(obj).prop('disabled',true);
        var params={};
        params.groupId=$("select[name=groups]").val();
        $.common.postJSON("请求的URL",params,function (data) {
        
            if(data.success){
                //....相关逻辑
            }else{
                //....相关逻辑
            }
        });
    }
script>
//后面省略

封装的common.js

(function ($) {
    $.common = {
        postJSON: function (url, data, success) {
            $.ajax({ type: "post", url: url, data: data, dataType: "json", success: success, error: function () { $.common.myAlert("系统异常，请稍后重试！"); } });
        }
     }
   })(jQuery);

Firefox中点击生成成绩的按钮一直弹出系统异常那段提示，而在chrome中执行正常，
后来在网上搜了很多资料博客
参照MDN的文档发现，Firefox中button默认的type为submit……

因此点击按钮的时候不是提交到请求的URL，而是提交了form表单…..

解决办法：
设置按钮的type属性为 button就行了

<button class="btn btn-primary" type="button" onclick="generateScore(this);"><i class="fa fa-random">i> 生成成绩button>

以上是本人遇到这个问题的解决办法，希望对读者有所帮助

转载于:https://www.cnblogs.com/ss0xt/p/8569782.html