试图让JavaScript变量范围纠正这种trello.get代码

Question

我一直在努力设置变量“列表名”范围正确的验证码...

var loadedAtriskopps = function(opps) { 
    var listName = 'empty'; 
    $.each(opps.cards, function(index, opp) { 
     Trello.get(
      '/cards/' + opp.id + '/list?fields=name', {fields: "id, name"}, function(list, err) { 
       var listName = list.name; 
       console.log(listName); //this returns the correct value 
      }); 
     console.log(listName); //this returns 'empty' 
     var opp = $("<div class='row'><div class='col-xs-6'><p class='output'>" + opp.name + "</b><br>On List: " + listName + " </p></div> </div>"); 
     $('#opps').append(opp) 
    }); 
}; 

里面的Trello.get功能它正确返回，但不在其外。经过几个小时的研究，仍然无法做到。

---

UPDATE：

每建议，尝试这种代码：

var loadedAtriskopps = function(opps) { 
    var listName = 'empty'; 
    $.each(opps.cards, function(index, opp) { 
     console.log(opp.name); // returns correct value 
     Trello.get('/cards/' + opp.id + '/list?fields=name', {fields: "id, name"}) 
       .success(function(list) { 
       listName = list.name; 
       console.log(listName); // // returns correct value 
       // next line errors "Uncaught TypeError: Cannot read property 'name' of undefined" but listName is correct 
       var opp = $("<div class='row'><div class='col-xs-6'><p class='output'>" + opp.name + "</b><br>On List: " + listName + " </p></div> </div>"); 
       $('#opps').append(opp); 
       }) 
       .error(function(err) { 
       console.log("An error: " + err); 
       }); 
    }); 
}; 

好像我已经失去了opp对象定义在成功回调。

---

SOLUTION：

var loadedAtriskopps = function(opps) { 
    var listName = 'empty'; 
    $.each(opps.cards, function(index, opp) { 
     Trello.get('/cards/' + opp.id + '/list?fields=name', {fields: "id, name"}) 
       .success(function(list) { 
       listName = list.name; 
       var card = $("<div class='row'><div class='col-xs-6'><p class='output'>" + opp.name + "</b><br>On List: " + listName + " </p></div> </div>"); 
       $('#opps').append(card); 
       }) 
       .error(function(err) { 
       console.log("An error: " + err); 
       }); 
    }); 
}; 

谢谢Darren和安迪！

Answer 1

我相信你需要将你的post-ajax操作转换为成功的回调。这应确保您在之后具有的实际值ajax的值为listName。

var loadedAtriskopps = function(opps) { 
    var listName = 'empty'; 
    $.each(opps.cards, function(index, opp) { 
     Trello.get('/cards/' + opp.id + '/list?fields=name', {fields: "id, name"}) 
       .success(function(list) { 
       listName = list.name; 
       console.log(listName); // should return correct value 
       var _opp = $("<div class='row'><div class='col-xs-6'><p class='output'>" + opp.name + "</b><br>On List: " + listName + " </p></div> </div>"); 
       $('#opps').append(_opp); 
       }) 
       .error(function(err) { 
       console.log("An error: " + err); 
       }); 
    }); 
};