• 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); 
                     }
                }
            });
           }
    }
  • 相关阅读:
    maven学习
    存储过程的作用
    数据库优化
    Springmvc整合mybatis
    Spring Mvc简介
    Axis2开发实例
    Mybatis之typeAlias配置的3种方法
    Spring AOP教程及实例
    spring AOP底层原理实现——jdk动态代理
    Java实现动态代理的两种方式
  • 原文地址:https://www.cnblogs.com/ziyoublog/p/9299099.html
Copyright © 2020-2023  润新知