在元素中查找最接近的日期然后添加类

时间:2012-12-04 08:07:16

标签: jquery arrays find closest

Ex:今天 4。癸

  1. 2012年12月

  2. 2012年12月

  3. 2012年12月

  4. 标题(2012年12月5日)

    标题(2012年12月7日)

    1. 2012年12月
    2. 最近的日期是5月12日(不是3月12日)(较新而不是较旧)

      如果超过一个“十二月”,那么只增加第一个孩子的课程

      HTML:

      <div class="wrap">
      
      <div class="zone" id="one">  
      <div class="box">
          <footer class="time">1. December 2012</footer>
      </div>
      
      
      <div class="box">
          <footer class="time">1. December 2012</footer>
      </div>
      
      <div class="box">
          <footer class="time">3. December 2012</footer>
      </div>
      
      
      <div class="box">
          <h2>Title <span class="time">(5. December 2012)</span></h2>
      </div>
      
      
      <div class="box">
          <h2>Title <span class="time">(7. December 2012)</span></h2>
      </div>
      
      
      <div class="box">
          <footer class="time">9. December 2012</footer>
      </div>
      
      </div>
      
      <div class="zone"  id="two">
          <!-- Same .zone#one but i will focus for .zone#one only-->
      </div>
      
      </div>
      
      
      <code></code>
      

      jQuery:

      var closest = [];
      
      $('.wrap > .zone:eq(0) .box').each(function(i) {
              var date = $(this).find(".time").html().replace("(","").split(".");
              closest.push(date[0]);
      });
      
      
      
      $("code").html(closest+"");
      

      游乐场: http://jsfiddle.net/WJvZb/

      我现在来到这一步,但不知道找到最近的日期并添加课程(例如.closest课程)

4 个答案:

答案 0 :(得分:1)

最简单的方法是解析每个日期时间(取决于格式),将它们推入数组,然后循环计算它们之间的时间差,并拉出最小值。您可以使用一些有用的库(如moment.js)进行日期解析和计算。

var now = new Date();
var closest = -1; //array ndx
var times = [];
var els = [];

$('.time').each(function(i) {
    times.push(someParsingMethod($(this).text());
    els.push($(this));
});

//initial difference
var diff = times[0].getTime() - now.getTime();

//check for lowest difference greater with a target date greater than now
for(var i=0;i<times.length;i++){
   var tmpDiff = times[i].getTime() - now.getTime();
   if(times[i].getTime() > now.getTime() && tmpDiff < diff){
       closest = i;
   }
}

if(closest != -1){
    els[closest].addClass("closestClass");
}

这只是伪代码,这项任务的真正挑战是解析专有日期格式。

答案 1 :(得分:1)

你应该用英语命名你的日期,因此“desember”...然后你可以迭代你的日期并从中创建Date对象,然后找到最接近的很容易。

var closest = [];

$('.wrap > .zone:eq(0) .box').each(function(i) {
    var date = $(this).find(".time").html().replace("(","").replace(")","");
        closest.push(new Date(date));
});

function closestTime(days, testDate)
{
    var bestDiff = null;

    for(i = 0; i < days.length; ++i){
        currDiff = Math.abs(days[i] - testDate);
        if(currDiff < bestDiff || bestDiff == null){
            bestDate = days[i];
            bestDiff = currDiff;
        } else if (currDiff == bestDiff && days[i] > testDate) {
            bestDiff = currDiff;             
        }
    }

    return bestDate;
}

console.log(closestTime(closest,new Date()));

答案 2 :(得分:1)

只要您使用数组,这是实现它的最简单方法。

var closest = [];
// Current Date
var current = new Date("04/12/2012");
// Function to get the Minimam value in Array
Array.min = function( array ){
    return Math.min.apply( Math, array );
};
// Played on your code
$('.wrap > .zone:eq(0) .box').each(function(i) {
    var date = $(this).find(".time").html().replace("(","").split(".");
    // If higher than current date
    if(current.getDay() < date[0]) {
        closest.push(date[0]);
    }
});
// Get the closest day..
$("code").html(Array.min(closest)+"");

在您的演示中播放:http://jsfiddle.net/BerkerYuceer/WJvZb/40/

答案 3 :(得分:1)

    function findActive(days, testDate) {
        var bestDiff = 0;
        var bestDate = null;
        var strDate = "No active";

        for(i = 0; i < days.length; ++i){
            var dDate = getDate(days[i]);

            currDiff = Math.abs(dDate - testDate);

            if(i ==0){
                bestDiff = currDiff;
            }

            if(dDate <= testDate){
                if(currDiff < bestDiff){
                    strDate = days[i];
                    bestDate =  dDate;
                    bestDiff = currDiff;
                    }else if(currDiff == bestDiff){
                    strDate = days[i];
                    bestDate =  dDate;
                }
            }
        }
        return strDate;
    }


function getDate(strDate){
    var day  = strDate.substring(0,2);
    var month = strDate.substring(3,5);
    var year  = strDate.substring(6,10);

    return new Date(parseInt(year), parseInt(month) - 1, parseInt(day));
}

date mask is: dd.MM.yyyy

        this code find active date. 
        enter code here
        example
        today is: 07.06.2013

        dates is: 03.06.2013, 4.6.2013, 5.6.2013 => return 5.6.2013
        dates is: 03.06.2013, 14.6.2013, 15.6.2013 => return 3.6.2013
        dates is: 08.06.2013, 14.6.2013, 15.6.2013 => return null
        dates is: 08.06.2013, 7.6.2013, 9.6.2013 => return 7.6.2013
        etc
相关问题