getJSON中的數組推送

Question

我將以下功能用作ahref鏈接上的onclick事件：

function checkOrgSaved() {
   var orgName = $.trim($("#orgName").val());
   var orgNames = new Array();

    $.getJSON("organizations?action=getOrganizations&onlyName=true&CSRFToken=" + csrf_token,   function (result) {
        for (var i = 0; i < Object.keys(result.Orgs).length; i++) {
            var org = result.Orgs[i].name;
            orgNames.push(org);
        }
    });

    if ($.inArray(orgName, orgNames) == -1 || orgName == 0){
        alert("Foobar.");
        $("#editLink").attr("href", "javascript:void(0);");
    }
}

這樣， if語句中的orgNames數組始終為空。 為什么？

但是，如果我在getJSON調用中聲明了orgNames數組，並將if語句也放入了getJSON()調用中，則該數組正確填充，但行$("#editLink").attr("href", "javascript:void(0);"); 不起作用，並且通過單擊ahref元素執行重定向。

我想要實現的是：如果orgName為空或在orgNames數組中不是NOT，則應引發JS警報-在另一頁面上不進行重定向。

Answer 1

這是因為$.getJSON調用是異步的，這意味着if語句將在接收JSON數據並執行回調並填充orgNames 之前執行。

您可能想獲取JSON並在單擊發生之前填充數組，然后只需再次檢查值即可：

var orgNames = new Array();

$.getJSON("organizations?action=getOrganizations&onlyName=true&CSRFToken=" + csrf_token,   function (result) {
  for (var i = 0; i < Object.keys(result.Orgs).length; i++) {
    var org = result.Orgs[i].name;
    orgNames.push(org);
  }
});

function checkOrgSaved() {
  var orgName = $.trim($("#orgName").val());

  if ($.inArray(orgName, orgNames) == -1 || orgName == 0){
    alert("Foobar.");
    $("#editLink").attr("href", "javascript:void(0);");
  }
}

這也將有助於避免對相同JSON數據的其他請求。

Answer 2

嘗試將代碼更改為此：

    function checkOrgSaved() {
       var orgName = $.trim($("#orgName").val());
       var orgNames = new Array();
       $.getJSON("organizations?action=getOrganizations&onlyName=true&CSRFToken=" + csrf_token,   function (result) {
            for (var i = 0; i < Object.keys(result.Orgs).length; i++) {
                var org = result.Orgs[i].name;
                orgNames.push(org);
            }
            if ($.inArray(orgName, orgNames) == -1 || orgName == 0){
              alert("Foobar.");
              $("#editLink").attr("href", "javascript:void(0);");
        }
        });   
    }

Answer 3

您傳遞給$.getJSON作為第二個參數的函數是一個回調，它將在異步HTTP調用完成后執行 。

$.getJSON之后的代碼將立即執行，這意味着當您嘗試通過數組訪問結果時，回調很可能尚未運行。

您必須將更新UI的邏輯移到回調函數中，以確保HTTP調用在執行時已完成。

function checkOrgSaved() {
   var orgName = $.trim($("#orgName").val());
   var orgNames = new Array();

    $.getJSON("organizations?action=getOrganizations&onlyName=true&CSRFToken=" + csrf_token,   function (result) {
        for (var i = 0; i < Object.keys(result.Orgs).length; i++) {
            var org = result.Orgs[i].name;
            orgNames.push(org);
        }

        if ($.inArray(orgName, orgNames) == -1 || orgName == 0){
            alert("Foobar.");
            $("#editLink").attr("href", "javascript:void(0);");
        }
    });
}

有關更多信息，請查看jQuery的docs 。

Answer 4

Javascript是一種異步語言，對嗎？ 發生的事情是，您的if語句在get函數的回調返回結果之前運行。

您應該將if檢查移入回調，如下所示：

$.getJSON("organizations?action=getOrganizations&onlyName=true&CSRFToken=" + csrf_token, function(result) {
    for (var i = 0; i < Object.keys(result.Orgs).length; i++) {
        var org = result.Orgs[i].name;
        orgNames.push(org);
    }
    if ($.inArray(orgName, orgNames) == -1 || orgName == 0) {
        alert("Foobar.");
        $("#editLink").attr("href", "javascript:void(0);");
    }
});