js中,for循环里面放ajax,ajax访问不到变量以及每次循环获取不到数据问题总结

  想在点击"终端控制"的时候能够开启多个窗口对多个终端进行管理:

/**提交事件**/
    $("#terminalControl").bind("click",function(){
        $("#terminalControl").removeClass();
        $("#terminalControl").addClass("btn_pointToPint " + $.cookie("color"));
        var keyValue = $("#gridTable").jqGridRowValue("id");
        var keyValueArray = keyValue.split(','),
        len = keyValueArray.length;
        for(var i = 0; i < len; i++){
            var rowData = $("#gridTable").jqGrid('getRowData',keyValueArray[i]);
               if(checkedRow(keyValueArray[i])){
                   $(this).attr("disabled","disabled");
                       $.ajax({ 
                         async:false,//必须设置为false,同步才行
                         url:'${basePath}/ptp/ptpAction_ipValid.do',
                         data:{ip:getcellTitle(rowData.ip)},
                         beforeSend:function(){
                            $("#terminalControl").attr("value",'<s:text name="cems.ptp"></s:text>');
                         },
                        success:function(responseText){
                            $("#terminalControl").attr("value",'<s:text name="cems.ok"></s:text>');
                            $("#terminalControl").removeAttr("disabled");
                            var obj = eval("(" + responseText + ")");
                            if(obj.result == "success"  ){
                                var resourceId="";
                                $.each(top.authorizeMenuData,function(i,n){
                                    if(n.text=="点对点控制"&&n.mark=="menu"||n.text=="ptpControl"&&n.mark=="menu"){
                                       resourceId=n.id;
                                    }
                                })
                            window.open("${basePath}/ptp/ptpAction_main.do?resourceId="+resourceId,"_blank"," toolbar=yes, menubar=yes, scrollbars=yes, resizable=yes,location=no, status=yes",false); 
                            }else if(obj.result == "multi"){
                                var ip = $("#ip_input").val();
                                dialogOpen({
                                   id: "ptp",
                                   title: "在线设备",
                                   url: "/ptp/ptpAction_listUI.do?ip="+ip,
                                    "500px",
                                   height: "1000px",
                                   offset:"rb",
                                   btn:null
                                })
                            }
                            else if(obj.result == "connectServerFail"){
                               dialogMsg("连接服务器失败!",0);
                            }else if(obj.result == "analyzeError"){
                               dialogMsg("服务配置解析数据失败!",0);
                            }else if(obj.result == "notOnline"){
                               dialogMsg("该设备不在线!",0);
                            }else{
                               dialogMsg('<s:text name="cems.public.msgFail"></s:text>',0);
                         }
                       }
                   });
               }
        }
    });  
}

  结果每次点开虽然开了多个窗口,但是每个窗口都是一样的,并没有达到开多个终端的页面的预期。

  问题所在:for 循环是一个单线程的东西,而ajax是多线程的,之所以称之为异步同步,是因为执行到ajax的时候去后台开启了一个线程,但是for循环本身就是一个单线程的东西,那么执行到ajax的时候,ajax开启了一个线程,for循环是没有等他的,直到for循环结束的时候,才会把ajax返回的数据拿回来,所以会出问题。

  解决办法:只需要把ajax改成同步的就可以了,每次for循环,都要去加载ajax方法,并且拿到他返回的数据,只需要在ajax中间加一个代码就可以搞定了。async: false,//设置成同步。

1、设置ajax参数async为false,即与js同步,默认是true(异步)。

2、采用递归循环的方法解决此问题。

function func(times){
    if(times <= 0){
        return;
    }
    $.get(url,data,function(){
        times --;
        func(times); //递归调用
    });
}
func(5);

 接下来我在试试:

1、当async:false的时候,

2、当async:true的时候,

3、采用递归的方式:

 /* 远程控制提交事件**/
$("#terminalControl").bind("click",function(){
    $("#terminalControl").removeClass();
    $("#terminalControl").addClass("btn_pointToPint " + $.cookie("color"));
    var keyValue = $("#gridTable").jqGridRowValue("id");
    var keyValueArray = keyValue.split(','),
         len = keyValueArray.length,
         i = 0;
    doajaxmenu(keyValueArray,i,len);
}); 

function doajaxmenu(keyValueArray,i,len){
    if(i >= len){
        return;
    }
    var rowData = $("#gridTable").jqGrid('getRowData',keyValueArray[i]);
    if(checkedRow(keyValueArray[i])){
        $(this).attr("disabled","disabled");
            $.ajax({ 
             async:false,
             url:'${basePath}/ptp/ptpAction_ipValid.do',
              data:{ip:getcellTitle(rowData.ip)},
              beforeSend:function(){
                 $("#terminalControl").attr("value",'<s:text name="cems.ptp"></s:text>');
              },
             success:function(responseText){
                 $("#terminalControl").attr("value",'<s:text name="cems.ok"></s:text>');
                 $("#terminalControl").removeAttr("disabled");
                 var obj = eval("(" + responseText + ")");
                 if(obj.result == "success"  ){
                     var resourceId="";
                       $.each(top.authorizeMenuData,function(i,n){
                           if(n.text=="点对点控制"&&n.mark=="menu"||n.text=="ptpControl"&&n.mark=="menu"){
                              resourceId=n.id;
                           }
                       })
                window.open("${basePath}/ptp/ptpAction_main.do?resourceId="+resourceId,"_blank"," toolbar=yes, menubar=yes, scrollbars=yes, resizable=yes,location=no, status=yes",false); 
                      
                 }else if(obj.result == "multi"){
                     var ip = $("#ip_input").val();
                     dialogOpen({
                        id: "ptp",
                        title: "在线设备",
                        url: "/ptp/ptpAction_listUI.do?ip="+ip,
                         "500px",
                        height: "1000px",
                        offset:"rb",
                        btn:null
                     })
                 }
                 else if(obj.result == "connectServerFail"){
                      dialogMsg("连接服务器失败!",0);
                 }else if(obj.result == "analyzeError"){
                    dialogMsg("服务配置解析数据失败!",0);
                 }else if(obj.result == "notOnline"){
                     console.log(i);
                    //dialogMsg("该设备不在线!",0);
                 }else{
                    dialogMsg('<s:text name="cems.public.msgFail"></s:text>',0);
                  }
                 i=i+1;
                 if(i < len){
                     doajaxmenu(keyValueArray,i,len); 
                 }
            }
        });
       }
}
原文地址:https://www.cnblogs.com/goloving/p/7376378.html