0

我是 javascript/jQuery 的新手,并且正在尝试对我的技能水平进行一些雄心勃勃的事情。我发现了一些有用但被卡住的片段。

我有一堆格式如下的日期:dd-month-yyyy(2013 年 10 月 10 日)。据我了解,这在某种程度上是一种非常规的日期格式。所以我要做的是将日期解析为正常格式,然后使用 jQuery tinysort 插件(我认为我使用不正确)排列父 div。

我在这里做了一个jsfiddle:http: //jsfiddle.net/8BYDZ/

或者这是我的代码:

<div id="date-sort">
  <div class="date-content"> 
    <p>Some Content</p>
    <p class="date-sort">10-Oct-2013</p>
    <hr />
  </div>
  <div class="date-content"> 
    <p>Some Content</p>
    <p class="date-sort">12-Oct-2013</p>
    <hr />
  </div>
  <div class="date-content"> 
    <p>Some Content</p>
    <p class="date-sort">2-Sep-2013</p>
    <hr />
  </div>
  <div class="date-content"> 
    <p>Some Content</p>
    <p class="date-sort">22-Jun-2013</p>
    <hr />
  </div>
  <div class="date-content"> 
    <p>Some Content</p>
    <p class="date-sort">1-May-2013</p>
    <hr />
  </div>
</div>
$(document).ready(function(){
    function customParse(str) {
      var months = ['Jan','Feb','Mar','Apr','May','Jun',
                    'Jul','Aug','Sep','Oct','Nov','Dec'],
          n = months.length, re = /(\d{2})-([a-z]{3})-(\d{4})/i, matches;

      while(n--) { months[months[n]]=n; } // map month names to their index :)

      matches = str.match(re); // extract date parts from string

      return new Date(matches[3], months[matches[2]], matches[1]);
    }

    var array = [];

    var elements = $('.date-sort');

    for(var i = 0; i < elements.length; i++) {
       var current = elements[i];
        if(current.children.length === 0 && current.textContent.replace(/ |\n/g,'') !== '') {
           // Check the element has no children && that it is not empty
           customParse(current.textContent);
           array.push(current.textContent);
        }
    } 

    $('div#date-sort>.date-content>.date-sort').tsort();

});

感谢您提供任何帮助、见解或意见。

4

3 回答 3

1

您只需用 消除-标记.replace(),然后使用new Date().getTime()您将 1970 年 1 月 1 日午夜和您的日期之间的毫秒数分配给您需要的数组.sort()

$(document).ready(function(){
  var ds = $('.date-sort'), dt = [];
  ds.each(function(i){
    dt[i] = new Date($(this).html().replace(/-/g, ' ')).getTime();
  });
  dt.sort();
  ds.each(function(i){
    $(this).html(new Date(dt[i])/*add . whatever here*/);
  });    
});

我更新了你的JSFiddle

于 2013-10-10T21:45:53.557 回答
1

你需要给 tinysort 一个可排序的日期。

new Date(matches[3], months[matches[2]], matches[1]).toJSON();

// ...

current.setAttribute('data-date', customParse(current.textContent));

// ...

$('div#date-sort>.date-content').tsort('.date-sort', {attr: 'data-date' });

您的正则表达式过于严格,因为天数并不总是两个数字。

re = /(\d{1,2})-([a-z]{3})-(\d{4})/i

这是一个工作的jsiddle

于 2013-10-10T21:25:37.733 回答
0

在 JavaScript 中,对象通常被认为是创建关联映射的最佳方式(正如下面评论者所指出的,在数组上设置属性是完全有效的)。

我会使用一个对象作为月份名称和数字之间的映射。此外,我会使用小写名称,因此我可以支付一次小写的成本,并在我的映射中使用该值。

所以我会months用一个对象初始化器替换你的数组的定义:

var months = { 'jan': 1, 'feb': 2, 'mar': 3, /*...*/ };

这样,您就不需要循环了。

现在您只需要调用.toLowercase()您的输入,月份名称就会正确映射。

于 2013-10-10T21:22:46.397 回答