根據日期按時間順序對JSON進行排序，使用jquery

Question

根據日期排序JSON文件中的一堆文章，根據它們的製作日期，任何想法？

我已經通過AJAX顯示數據並限制爲6個結果，但我真的很努力地通過日期對它進行排序。日期是在JSON文件中的字符串

JSON：

[ 
    { 
    "id": "5537a23050b2c722f390ab60", 
    "thumbImage": "http://lorempixel.com/175/115", 
    "title": "reprehenderit nisi occaecat magna eiusmod officia qui do est culpa", 
    "author": "Melton Myers", 
    "description": "sint aliqua in anim nulla Lorem aute voluptate veniam anim aliquip laborum sit voluptate amet proident est incididunt aute amet sit est elit ad cillum occaecat velit esse id quis velit deserunt esse occaecat dolore elit deserunt quis cillum cupidatat enim consectetur consectetur proident", 
    "url": "http://fakeurl.com", 
    "date": "26-01-2015", 
    "tags": [ 
     "eu", 
     "velit", 
     "mollit" 
    ] 
    } 
] 

的jQuery：

// getting JSON data from js/article_data.json 
$.ajax({ 
    url: 'js/article_data.json', 
    dataType: 'json', 
    type: 'get', 
    cashe: true, 
    success: function(data) { 
     //Making so that only 6 results are show 
     $(data).slice(0, 6).each(function(index, value) { 
      //setting varibles to data in article_data.json 
      var clear = "<div class='clear'></div>"; 
      var img = "<a href='" + value.url + "'>" + "<img src= " + value.thumbImage + "/></a>"; 
      var title = "<a class='title' href='" + value.url + "'>" + value.title + "</a>"; 
      var description = "<p>" + value.description + "</p>"; 
      var date = "<small class='date'>" + value.date + "</small>"; 
      var tags = "<small class='tags'> Tags:<br>" + value.tags + "</small><hr>"; 
      var closeLink = "</a>"; 
      // putting the JSON data into the HTML (inside the div with an id of news) 
      $(clear).appendTo('#news'); 
      $(img).appendTo('#news'); 
      $(title).appendTo('#news'); 
      $(date).appendTo('#news'); 
      $(description).appendTo('#news'); 
      $(tags).appendTo('#news'); 
      $(closeLink).appendTo('#news'); 

     }); 
     //Checking to see if there is data in the JSON file and throwing up an error sign if there is. 
     if (data.length === 0) { 
      var error = "<div class='error'><h1>Opps! No results!</h1></div>"; 
      $(error).appendTo('#news'); 
     } 
    } 

}); 

Answer 1

你可以嘗試這樣的事情：

array.sort(function(a,b){ 
    if(a.date<b.date){ 
    return -1 
    } 
    if(a.date>b.date){ 
    return 1 
    } 
    return 0  
}) 

Answer 2

您可以按使用在做每個之前。喜歡這個。

var a = [ 
 
    { 
 
    "id": "asdf", 
 
    "date": "26-01-2015", 
 
    "tags": [ 
 
     "eu", 
 
     "velit", 
 
     "mollit" 
 
    ] 
 
    }, 
 
    { 
 
    "id": "qqqq", 
 
    "date": "20-01-2015", 
 
    "tags": [ 
 
     "eu", 
 
     "velit", 
 
     "mollit" 
 
    ] 
 
    }, 
 
    { 
 
    "id": "ttttt", 
 
    "date": "26-01-2016", 
 
    "tags": [ 
 
     "eu", 
 
     "velit", 
 
     "mollit" 
 
    ] 
 
    } 
 
]; 
 

 
var b = a.sort(function(a, b){return a.date < b.date;}); 
 

 
console.log(b);

順序可以以比較功能的排序方法來改變。

希望這會有所幫助。

Answer 3

您在json數組中使用的日期格式是DD-MM-YYYY格式，您需要使用YYYY-MM-DD格式（ISO）格式化它。然後，你可以在此日期轉換爲JavaScript日期對象，那麼你可以使用它進行這樣的比較：

new Date(a.date.split("-").reverse()); 

全碼：

$(document).ready(function() { 
    $.ajax({ 
    url: "/echo/json/", // path for json 
    data: data, 
    type: "POST", 
    success: function(response) { 
     data = response.slice(0, 6).sort(function(a, b) { 
     A = new Date(a.date.split("-").reverse()); 
     B = new Date(b.date.split("-").reverse()); 
     return A < B; 
     }); 
     $.each(data, function(index, value) { 
     itemHtml = "<div class='clear'></div><a href='" + value.url + "'><img src= '" + value.thumbImage + "'/></a><a class='title' href='" + value.url + "'>" + value.title + "</a> <p>" + value.description + "</p><small class='date'>" + value.date + "</small> <small class='tags'> Tags:<br>" + value.tags.join() + "</small><hr> </a>"; 

     $("#news").append(itemHtml); 
     }); 

    } 
    }); 
}); 

這裏的工作演示https://jsfiddle.net/cqx4dhL5/3/

讓我知道如果您需要任何解釋