jquery每個不按順序排序json數據

我有一個腳本，從json調用中獲取數據，並且它工作正常。唯一的問題是每次使用jquery時它會隨機進入並顯示。 MySQL的查詢很好，如果我「排列列名ASC」或其他任何東西導致JSON代碼輸出正常。jquery每個不按順序排序json數據

這裏是部分：

success: function(viddata) { 
    $.each(viddata.videos, function(i, video){ 
     $.getJSON("https://www.googleapis.com/youtube/v3/videos", { 
      key: "mykey", 
      part: "snippet,contentDetails,statistics", 
      id: video 
     }, function(data) { 
      var duration = convert_time(data.items[0].contentDetails.duration); 
      var views = data.items[0].statistics.viewCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
      $(".bbox_content.bbox_videos .content_loader_container").remove(); 
      $(".bbox_content.bbox_videos").append($('<div class="bbox_item bbox_video_item" id=\"' + video + '\"><a class="video_item youtube_video" name=\"' + video + '\" href="/video/' + video + '" style="background-image:url('+ data.items[0].snippet.thumbnails.high.url +');"><span class="img"><img width="100%" src="/images/movie_arrow.png"/></span><span class="video_time">'+ duration +'</span></a>'+ viddata.controls +'<div class="bbox_video_item_info"><span class="video_title">'+ data.items[0].snippet.title +'</span><span class="view_count">Views: '+ views +'</span></div></div>').hide().fadeIn(800)); 
     }); 
    }

我怎樣才能解決這正常嗎？有人可以告訴我嗎？

謝謝！

來源

2016-03-04 rcsnooks

您的問題是什麼？你爲什麼做這個 – Derek

getJSON進行AJAX調用以獲取數據。 AJAX stands for Asynchronous Javascript And XML。意思是，請求按順序進行，但是，在前一個請求結束之前，第二個或第三個或第n個請求可能會返回。要測試是否發生了這種情況，請在瀏覽器中打開開發人員控制檯並查看網絡活動（應該有一個過濾器僅查看XHR *。使用該過濾器）

解決方法是，先前的請求返回或追加所有需要在手邊添加的div，並跟蹤哪個請求填充哪個div。

success: function(viddata) { 

    $.each(viddata.videos, function(i, video) { 
    var $videoDiv = $('<div id="' + video + '" style="display:none;"></div>').appendTo(".bbox_content.bbox_videos"); 

    $.getJSON("https://www.googleapis.com/youtube/v3/videos", { 
     key: "mykey", 
     part: "snippet,contentDetails,statistics", 
     id: video 
    }, function(data) { 
     var duration = convert_time(data.items[0].contentDetails.duration); 
     var views = data.items[0].statistics.viewCount.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); 
     $(".bbox_content.bbox_videos .content_loader_container").remove(); 
     $videoDiv.addClass('bbox_item bbox_video_item') 
      .append('<a class="video_item youtube_video" ' 
      + ' name="' + video + '" ' 
      + ' href="/video/' + video + '" ' 
      + ' style="background-image:url('+ data.items[0].snippet.thumbnails.high.url +');">' 
      + '<span class="img">' 
       + '<img width="100%" src="/images/movie_arrow.png"/>' 
      + '</span>' 
      + '<span class="video_time">'+ duration +'</span>' 
      + '</a>' 
      + viddata.controls 
      + '<div class="bbox_video_item_info">' 
      + '<span class="video_title">' 
       + data.items[0].snippet.title 
      + '</span>' 
      + '<span class="view_count">' 
       + 'Views: '+ views 
      + '</span>' 
      + '</div>') 
      .fadeIn(800); 
    }); 
}

我可能在格式上有些過分，但你必須承認，這很容易看到發生了什麼。

* XHR：XmlHttpRequest

來源

2016-03-04 04:46:59 Terminus

jquery每個不按順序排序json數據

回答

相關問題