javascript - jQuery - 变量范围问题

Question

我有以下 javascript:

      $.getJSON('/calculate_quote/' + moulding_1_id, function(data) {
        moulding_1_cost = data.moulding.cost;
        moulding_1_width = data.moulding.width;
      });
      cost_of_moulding = ( ( 2 * ( width + ( 2 * moulding_1_width ) ) + 2 * ( height + ( 2 * moulding_1_width ) ) ) / 1000 ) * moulding_1_cost;
      $('#item_total').html( cost_of_moulding );

问题是 moulding_1_cost 和 moulding_1_width 这两个变量在 getJSON 调用之外未定义。如何使这两个变量在 getJSON 调用之外可用？

Answer 1

在该回调运行之前(当服务器返回 JSON 数据时)，变量不会设置，因此您需要从该回调中调用使用它们的任何代码，如下所示:

$.getJSON('/calculate_quote/' + moulding_1_id, function(data) {
  var moulding_1_cost = data.moulding.cost;
  var moulding_1_width = data.moulding.width;
  var cost_of_moulding = ( ( 2 * ( width + ( 2 * moulding_1_width ) ) + 2 * ( height + ( 2 * moulding_1_width ) ) ) / 1000 ) * moulding_1_cost;
  $('#item_total').html( cost_of_moulding );
});

或者像这样调用另一个函数:

$.getJSON('/calculate_quote/' + moulding_1_id, function(data) {
  someFunction(data.moulding.cost, data.moulding.width);
});
function someFunction(mqc, m1w) {
  var cost_of_moulding = ( ( 2 * ( width + ( 2 * m1w) ) + 2 * ( height + ( 2 * m1w) ) ) / 1000 ) * m1c;
  $('#item_total').html( cost_of_moulding );
}

无论哪种情况，您都需要触发任何使用数据的东西一旦您拥有数据，所有异步操作都是这样。