jQuery 等到函数完成

Question

我有这个脚本：

var d;
$(".circle").click(function() {
    var id = $(this).attr('id');
    var MyDiv1 = document.getElementById(id);
    var name = MyDiv1.innerHTML;

    $.get("url", function(data){
    d=data;
    });

    d=d.split(",");
    var arrayLength = d.length;
    for (var i = 0; i < arrayLength; i++) {
        if(i==id)
         custom_alert(d[i], name);
    }
});

我想打电话给

d = d.split(",");

只有在我确定 d 不是 undefined 之后。
在 $.get 函数完成并将 d 分配给数据后，如何执行它？

Answer 1

你可以简单地把它放到回调中吗？ :

    $.get("url", function(d){
         d=d.split(",");
         var arrayLength = d.length;
         for (var i = 0; i < arrayLength; i++) {
           if(i==id)
            custom_alert(d[i], name);
         }
    });

或者使用 ES7（非常新的东西）：

(async function(){
var d=await new Promise(function(r){
  $.get("url",r);
});
d=d.split(",");
...
})();

Answer 2

需要将定义的依赖d的JS放在get回调中

var d;
$(".circle").click(function() {
var id = $(this).attr('id');
var MyDiv1 = document.getElementById(id);
var name = MyDiv1.innerHTML;

$.get("url", function(data){
d=data;

   d=d.split(",");
   var arrayLength = d.length;
   for (var i = 0; i < arrayLength; i++) {
    if(i==id)
     custom_alert(d[i], name);
   }
 });
});

Answer 3

jQuery.get() 是异步的，因为它是 jQuery.ajax() 的 shorthand，请求的默认选项是 async: true .

Read here关于异步请求。

// declare it here if you need its values later (to be a global variable), or move it inside function(){ } declared inside $.get() call.
var d;
$(".circle").click(function() {
    var id = $(this).attr('id');
    var MyDiv1 = document.getElementById(id);
    var name = MyDiv1.innerHTML;

    $.get("url", function(data){
         d=data;
         // $.get has an asynchronous answer (you don't know when it will come or if it comes). Call d.split here
         d=d.split(",");
         var arrayLength = d.length;
         for (var i = 0; i < arrayLength; i++) {
             if(i==id)
              custom_alert(d[i], name);
        }
    }); 
 });

Answer 4

你只能依靠d在它被赋值的块中有一个值，它在回调function(data){...}.

中

var d;
$(".circle").click(function() {
  var id = $(this).attr('id');
  var MyDiv1 = document.getElementById(id);
  var name = MyDiv1.innerHTML;

  $.get("url", function(data){
    d=data.split(",");
    var arrayLength = d.length;
    for (var i = 0; i < arrayLength; i++) {
      if (i==id)
        custom_alert(d[i], name);
    }
  });
});

jQuery 等到函数完成

jQuery wait till function finishes

javascript

jquery

asynchronous

wait

async-await