2

如果这是重复的,我很抱歉,但我找不到与我的问题相匹配的现有答案(我已经看过了!)。

我有一个包含大约十几个项目的列表,每个项目都有一个<span>*fixed date*</span>.

包含日期的列表看起来像这样......

<ul id="whatson">
  <li>
     <span class="chkdate">06/04</span> 
     somestuff1
  </li> 
  <li>
     <span class="chkdate">06/05</span> 
     somestuff2
  </li>
  .......
</ul>

我想过滤列表,以便隐藏所有早于今天的日期。

会给我今天的日期,例如 mm/dd = 06/04,这似乎很好。

我现在想针对格式为例如 06/04 的每个列表项进行检查,并隐藏那些早于今天的项目。

它只需要在页面加载时运行一次。

到目前为止我的代码...

$(document).ready(function () {
    var d = new Date();
    var month = d.getMonth() + 1;
    var day = d.getDate();
    var todaysdate = (month < 10 ? '0' : '') + month + '/' + (day < 10 ? '0' : '') + day;

    alert("checking " + datetocheck + " against today = " + todaysdate);
    --- * temp check *

    var datetocheck = $('#whatson li span.chkdate').text();

    if (datetocheck < todaysdate) {
          $('#whatson li').hide();
    } else {
          $('#whatson li').show();
    };
})

我的警报显示..

Checking 06/0406/04 against today 06/04 *(when all list dates match)*

并正确显示。

更改警报显示的一个或多个列表日期

Checking 06/0306/04 against today 06/04 *(when one or more list dates don't match)*

什么都没有显示。

你能帮忙吗,我认为这会很直接,但无法得到结果?

4

5 回答 5

1

你需要一个 for 循环:

var datestocheck = $('#whatson li span.chkdate');

  for (var i = 0; i < datestocheck.length; i++) {
    var compare = parseDate(datestocheck[i].text());

    if (compare < todaysdate) {
      datestocheck[i].hide();
    }
  }
于 2013-06-04T17:59:02.527 回答
1

jsFiddle 上的示例

示例 html

<ul id="whatson">
  <li>
     <span class="chkdate">06/01</span> 
     somestuff1
  </li> 
  <li>
     <span class="chkdate">06/04</span> 
     somestuff1
  </li> 
  <li>
     <span class="chkdate">06/05</span> 
     somestuff2
  </li>
</ul>

脚本

var today = new Date();
$("#whatson .chkdate").each(function() {
    // split the text and get the month/day value
    var datepieces = $(this).text().split("/");
    var month = datepieces[0];
    var day = datepieces[1];

    // if the month of the element is previous to today's month
    // hide the li
    if (month < (today.getMonth() + 1))
        $(this).closest("li").hide();

    // if the day of the element is previous to today
    // hide the li
    if (day < today.getDate())
        $(this).closest("li").hide();
});
于 2013-06-04T18:04:02.503 回答
1

jsFiddle 示例

使用.each()jQuery 函数循环选择每个元素。使用 JavaScript.split()函数将文本值转换为日期。另请参阅有关 JavaScript 日期的文档

HTML:

<ul id="whatson">
    <li><span class="chkdate">06/03</span> somestuff1</li>
    <li><span class="chkdate">06/04</span> somestuff1</li>
    <li><span class="chkdate">06/05</span> somestuff2</li>
</ul>

JavaScript:

$(document).ready(function () {
    var todaysdate = new Date();

    var datestocheck = $('#whatson li').each(function (i, v) {
        var listitem = $(v); var chkdate = $('span', listitem);

        var stringdate = chkdate.text();
        var monthtocheck = stringdate.split('/')[0];
        var daytocheck = stringdate.split('/')[1];

        var datetocheck = new Date(); 
        datetocheck.setFullYear(
            todaysdate.getFullYear(), // four digit year
            monthtocheck-1, // month number minus 1 b/c month is 0-11
            daytocheck // the day number
        );

        //alert(datetocheck + ' < ' + todaysdate);

        if (datetocheck < todaysdate) { 
            listitem.hide();
        } else { 
            listitem.show(); 
        }
    });
})
于 2013-06-04T18:15:43.993 回答
1

正如评论中所提到的,比较类型的变量总是更好Date(这样你就不需要照顾到 12 月的广泛比较,这可能很麻烦)。因此,我使用的方法是将文本转换为Date类型对象并将其与当前日期进行比较:

  var d = new Date();
  d.setHours(0, 0, 0, 0);
  var year = d.getFullYear();
  $(".chkdate").each(function (i) {
      //added a setHours function to make time parameters of Date zero before comparing
     ((new Date($(this).text() + "/" + year)).setHours(0, 0, 0, 0) < d) ? $(this).closest("li").hide() : $(this).closest("li").show();
  });

假设:

  • 对于 HTML 中的元素,年份将始终是当前年份

  • 的格式mm/dd将始终保持

    见小提琴:http: //jsfiddle.net/UAR8y/8/

编辑

  • 不得不添加更多行,因为对于当前日期,它也在比较时间,因此不匹配。通过使用从参数中删除时间参数.setHours(0, 0, 0, 0);
  • 改为>_<
于 2013-06-04T18:19:34.953 回答
0

请看一下http://jsfiddle.net/2dJAN/57/

$(document).ready(function() {
var d = new Date();
var month = d.getMonth()+1;
var day = d.getDate();
var todaysdate = (month<10 ? '0' : '') + month + '/' + (day<10 ? '0' : '') + day;
    $('#whatson li').each(function(){
        var datetocheck = $(this).text();
        if (datetocheck < todaysdate) {
            $(this).hide();
            }         
    });
})

我可以知道这是否是您的要求。

于 2013-06-04T18:00:59.257 回答