將json響應轉換爲javascript數組

Question

我從$ .getJSON獲得來自我的web服務器的json響應。這是響應：

[{"id":"1","latitude":"28.63","longitude":"77.21","price":"0"},{"id":"2","latitude":"28.71","longitude":"77.19","price":"100"}] 

這是我的javascript代碼對此的迴應將數組轉換：

var i = 0; 
var vehicleId = $('#selectVehicle option:selected').val(); 
$.getJSON('getFillingDetails.php', {id : vehicleId}, function(data){ 
    var lat = []; 
    var lon = []; 
    var price = []; 
    $.each(data, function(key, value){ 
     lat.push(value.latitude); 
     lon.push(value.longitude); 
     price.push(value.price); 
     i++; 
    }); 
}); 
console.log(i); 

但是，當我看到控制檯我的價值它不會改變。它仍然是0.這意味着$.each()內沒有任何事情發生。我完全陌生的JavaScript。任何幫助將不勝感激。

Answer 1

嘗試了這一點：

var i = 0; 
var vehicleId = $('#selectVehicle option:selected').val(); 
$.getJSON('getFillingDetails.php', {id : vehicleId}, function(data){ 
    var lat = []; 
    var lon = []; 
    var price = []; 
    $.each(data, function (i, item) { 
     $.each(item, function(key, value){ 
      lat.push(value.latitude); 
      lon.push(value.longitude); 
      price.push(value.price); 
      i++; 
     }); 
    }); 
    console.log(i); 
}); 

你的主要問題是，因爲AJAX是A（同步）.J（avascript）A（ND）X（ML），通知asynchronous，你CONSOLE.LOG（I）在請求完成之前被解僱。我注意到的另一個問題是，你試圖只循環一個對象。雖然你的JSON從一個數組開始，但它也必須循環。

只是一個建議。本機循環非常簡單，功能更快。不使用$.each我建議：

var i = 0; 
var vehicleId = $('#selectVehicle option:selected').val(); 
$.getJSON('getFillingDetails.php', {id : vehicleId}, function(data){ 
    var lat = []; 
    var lon = []; 
    var price = []; 
    for (var i = 0, item = data[i]; i < data.length; i++) { 
     for (var key in item) { 
      var value = key[item]; 
      lat.push(value.latitude); 
      lon.push(value.longitude); 
      price.push(value.price); 
      i++; 
     }; 
    }; 
    console.log(i); 
}); 

現在，我才知道的jQuery是爲了讓你的工作更輕鬆。但我認爲這隻會導致開發者變得懶惰。我認爲jQuery是驚人的。

Answer 2

只需使用索引：：但是，一旦我意識到，本地環路是容易C I已經使用$.each停止

var data = [{"id":"1","latitude":"28.63","longitude":"77.21","price":"0"}, 
      {"id":"2","latitude":"28.71","longitude":"77.19","price":"100"}, 
      {"id":"2","latitude":"28.71","longitude":"77.19","price":"100"}]; 
var i; 
var lat = []; 
var lon = []; 
var price = []; 

$.each(data, function(index, value){ 
    lat.push(value.latitude); 
    lon.push(value.longitude); 
    price.push(value.price); 
    i = index; 
}); 

console.log(i); 

看看這個小提琴，我認爲它應該做你想要什麼

http://jsfiddle.net/vmy3b/3/

Answer 3

試試這個代碼

var i = 0; 
var vehicleId = $('#selectVehicle option:selected').val(); 
var jsonData; 
$.getJSON('getFillingDetails.php', {id : vehicleId}, function(data){ 

    jsonData = data; 
}); 
var lat = []; 
    var lon = []; 
    var price = []; 
$.each(jsonData, function(key, value){ 
     lat.push(value.latitude); 
     lon.push(value.longitude); 
     price.push(value.price); 
     i++; 
    }); 
console.log(i); 

Answer 4

在JavaScript中使用異步功能有時會混淆，這是爲什麼

例：

var result = 'pending'; 
$.ajax({ 
    url: 'something.php', 
    success: function() { 
    result = 'success'; 
    } 
}); 

現在，如果我們想在這裏使用的結果，我們就不會取得好成績

console.log(result); // 'pending'

所以相反，我認爲你最好打電話'f在一個像這樣的

var makeArray = function(data) { 
    var i = 0, 
     vehicleId = $('#selectVehicle option:selected').val(), 
     lat = [], lon = [], price = []; 

    $.each(data, function(key, value){ 
     lat.push(value.latitude); 
     lon.push(value.longitude); 
     price.push(value.price); 
     i++; 
    }); 
    console.log(i); 
}; 

$.getJSON('getFillingDetails.php', {id : vehicleId}, function(data){ 
    makeArray(data); 
});