Question

我有两个下拉列表，一个是国家，另一个是州。第一次下降后第一次下降。我有两个功能，如 LoadCountry（）和LoadStates（），其中LoadState在LoadCountry之后触发。

我的问题是，当我尝试将drpCountry的值设为

时，得0或null

var CId = $（＆＃34;＃＆＃34; +＆＃39;＆lt;％= drpCountry.ClientID％＆gt;＆＃39;）。val（）;。

问题仅发生在页面加载时。当我更改drpCountry的值时数据加载在drpState中正确地说。面对同样的问题，其他网页也有4到5个下拉菜单。但是当我通过设置setTimeout来改变执行速度时精细。

我可以强烈地说数据正在加载相关数据。 a，我在控制台中查了一下。 b，当我更改下拉数据加载到drpState正确

时

为什么LoadState（）在LoadCountry（）执行完全执行之前执行？

    $(function() {
    LoadCountry();
    LoadState();
    /* when set timeout LoadState works fine */
    //setTimeout(function () {
    //LoadState();
    //}, 200);

    /* Changed Timeout when upload to server */
    //setTimeout(function () {
    //LoadState();
    //}, 300);

    $("#<%=drpCountry.ClientID%>").change(function() {
        LoadState();
    })
});

function LoadCountry() {
    $.ajax({
        type: 'Post',
        url: 'country.aspx/Loadcountry',
        contentType: "application/json; charset=utf-8",
        data: "{}",
        dataType: 'json',
        success: function(data) {
            console.log(data);
            if (data.d.length > 0) {
                $("#<%=drpCountry.ClientID%>").empty();
                for (var i = 0; i < data.d.length; i++) {
                    var Value = data.d[i];
                    var Id = Value.split('/')[0];
                    var Name = Value.split('/')[1];
                    $("#<%=drpCountry.ClientID%>").append($('<option>', {
                        value: Id,
                        text: Name
                    }));
                }
            } else {
                $("#<%=drpCountry.ClientID%>").empty();
                $("#<%=drpCountry.ClientID%>").append($('<option>', {
                    value: "0",
                    text: "--Select--"
                }));
            }
        }
    });
}

function LoadState() {
    var CId = $("#" + '<%=drpCountry.ClientID%>').val();
    alert(CId); //Getting Zero as Cid but have values
    $("#<%=drpState.ClientID%>").append($('<option>', {
        value: "0",
        text: "--Loading--"
    }));
    $.ajax({
        type: 'Post',
        url: 'country.aspx/LoadState',
        contentType: "application/json; charset=utf-8",
        data: "{'CId':'" + CId + "'}",
        dataType: 'json',
        success: function(data) {
            console.log(data);
            if (data.d.length > 0) {
                $("#<%=drpState.ClientID%>").empty();
                for (var i = 0; i < data.d.length; i++) {
                    var Value = data.d[i];
                    var Id = Value.split('/')[0];
                    var Name = Value.split('/')[1];
                    $("#<%=drpState.ClientID%>").append($('<option>', {
                        value: Id,
                        text: Name
                    }));
                }
            } else {
                $("#<%=drpState.ClientID%>").empty();
                $("#<%=drpState.ClientID%>").append($('<option>', {
                    value: "0",
                    text: "--Select--"
                }));
            }
        }
    });

Answer 1

我尝试了一些步骤，似乎下面的代码可以正常工作，

var stateVar = true;

function loadState(){
  // some code
}

function loadCountry(){
  $.ajax({
    ...
    ...
    success:function(res){
      if(stateVar){ loadState(); stateVar = false; }
    }
  })
}

$(function() {
    LoadCountry();
    $("#<%=drpCountry.ClientID%>").change(function() {
        LoadState();
    })
});

JQuery-Ajax第二个函数在第一个函数之前执行

1 个答案: