按钮的type会对ajax的异步请求处理有影响

最新推荐文章于 2022-07-03 23:09:52 发布

原创最新推荐文章于 2022-07-03 23:09:52 发布 · 479 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#ajax #异步 #按钮type

前端专栏收录该内容

1 篇文章

订阅专栏

本文介绍了一个关于Ajax请求中同步提交的问题及解决方法。作者在使用Ajax处理表单提交时遇到页面直接跳转而非异步处理的情况，最终发现是由于添加按钮未指定type属性，默认按submit行为触发所致。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天用ajax处理页面表单提交时，请求处理成功后会跳到一个输出rusult的信息的页面

$.ajax({

    type : 'post',

    url : '${req.contextPath}/portal/xhWhitelist/addAdmin',   

    data :$('#formInfo').serialize(),

    dataType : 'json',

    success : function(data) {

     if(!data) {

alert(“添加失败”);

return;

}

if(data.result){

alert(“添加成功”);

window.location.href = "${req.contextPath}/portal/xhWhitelist/adminlist";

}

else{

alert(data.message);

}

    },

    error : function (request) {

        alert("添加失败");

    }

});

    检查了很久都没发现问题出现在哪里，而且其他的和他写法一样的ajax请求都是正常的。纠结了很久，后来才发现我的添加按钮没写type  <button class="btn btn-info" onclick="addItem()">添加</button>，然后我加上type=“button"就好了。

    一个小问题，花了很久的时间才搞定，按钮的type默认值是submit，如果不写type一点击按钮数据就会默认提交了，所以这种情况下ajax没有异步请求。