JS中如何防止AJAX命令重复加载(执行一次,自动向后台发送两次以上的请求) - 巴中市万纵网络科技有限公司
雷竞技推荐码raybet网投雷竞技平台风控有限公司
首页 | 联系方式 | 加入收藏 | 设为首页 | 手机站
  • 网站首页
  • 公司简介
  • 产品展示
  • 新闻中心
  • 常见问题
  • 联系我们
  • 产品目录

    联系方式

    联系人:业务部
    电话: 00126-83979
    邮箱:service@q235cwfgg.com

    当前位置:首页 >> 产品展示 >> 默认分类 >> 正文

    JS中如何防止AJAX命令重复加载(执行一次,自动向后台发送两次以上的请求)

    详细信息:

    将代码部署在服务器上后,在提交数据并将数据插入数据库时,总是在提交后不多时,数据便变成了乱码。后来发现原来是AJAX在捣鬼。

    1、将如下代码放在将要发送AJAX请求的方法前

    <!--防止ajax重复加载-->
    <script>
     function prevent_reloading(){
     var pendingRequests = {};
     jQuery.ajaxPrefilter(function( options, originalOptions, jqXHR ) {
     var key = options.url;
     console.log(key);
     if (!pendingRequests[key]) {
     pendingRequests[key] = jqXHR;
     }else{
     //jqXHR.abort(); //放弃后触发的提交
     pendingRequests[key].abort(); // 放弃先触发的提交
     }
     var complete = options.complete;
     options.complete = function(jqXHR, textStatus) {
     pendingRequests[key] = null;
     if (jQuery.isFunction(complete)) {
     complete.apply(this, arguments);
     }
     };
     });
     }
    </script>

    例如:我要执行一个创建标签的方法,可按照如下方法进行

    <!--创建标签-->
    <script type="text/javascript">
     function create_tag_fun(){
     <!--将防止ajax重复加载的方法放在此处-->
     prevent_reloading()
     <!--就是上面的方法-->
     var new_tag = $('#new_tag').val();
     if(new_tag.length==0){
     alert("请输入标签名!")
     }
     else{
     $.ajax({
     <!--向后台提交数据的时候最好使用post请求(重要!)-->
     type: 'post',
     url: '/create_new_tag/',
     dataType: 'json',
     async: false,
     data: {'new_tag': new_tag},
     success: function (data){
     var data = data.data
     if(data == 1){
     alert("标签添加成功!请刷新显示!")
     }
     else{
     alert("此标签数据库中已存在!")
     }
     },
     error: function (jqXHR, textStatus, errorThrown) {
     if(errorThrown != 'abort'){
     alert('应用加载失败!');
     }
     },
     });
     }
     }
    </script>

    完毕!