限制innerhtml详细信息显示到特定日期

时间:2014-05-08 07:44:27

标签: javascript jquery html

我的日历结构如下。

<td class="fc-day fc-mon fc-widget-content fc-future fc-first" data-date="2014-05-12"></td>
<td class="fc-day fc-tue fc-widget-content fc-future" data-date="2014-05-13"></td>
<td class="fc-day fc-wed fc-widget-content fc-future" data-date="2014-05-14"></td>

我动态地将内容添加到innerHTML的{​​{1}}。以下是在td中插入值的代码。

下面的函数td用于附加td的innerhtml。我想在数据日期之前追加到td上工作。

appendinnerhtml()

工作正常。但是我的问题如果我将function appendinnerhtml(newtitle,newdays) { var specl=newtitle.split("@"); var newres=specl[0]+'<br />'+specl[1]+'<br />'; var Newspltdays=newdays.split(","); for (var c=0;c<Newspltdays.length;c++) { $('.fc-day').css('height', 144+'px'); var items = newres, divs = document.querySelectorAll('td.fc-'+Newspltdays[c]); [].slice.call(divs).forEach(function (div) { div.innerHTML = div.innerHTML + items; }); } } 传递给innerHTML,它适用于每个月的所有星期二。我希望这只能显示特定的日期。

参考图片附件 enter image description here

2 个答案:

答案 0 :(得分:3)

您可以使用表格中提供的data-date属性值与您需要的日期限制进行比较。 您可以按$("td fc-tue").attr("data-date")提取日期,然后将其转换为日期对象进行比较

var d2 = Date.parse("12/05/14")    // Your required date

[].slice.call(divs).forEach(function (div) {
        var d1 =  Date.parse(div.attr("data-date"))
    if(d1 < d2) // check if the date is less than required date 
          div.innerHTML = div.innerHTML + items;
});

答案 1 :(得分:1)

遍历表格。检查日期是否适合追加。如果是这样,请附上您的商品。请检查以下代码

$('.fc-border-separate tr').each(function () {
    $(this).find('td').each(function () {
var eachday=$(this).attr("data-date"); //here you will get date on each td

var d1 = Date.parse(eachday);
var d2 = new Date("2014-05-09");

if(d1 <= d2)
{

$(this).append(items); //here you can append your item to td
});
}

}); //traversing through td ends here
}); //traversing through tr ends here