在特定日期使用jquery隐藏表列 [英] Hide a table column using jquery in a particular date

问题描述

我在db中有一个名为view results的表.它有3列..我想在14天后隐藏其第3列"Apply Recorrection".示例:表显示日期为2012-12-01.14天后如何显示我隐藏了这第三列(引用该表的学生将看不到IN 2012-12-15表.)....这是我的示例代码:

<table border=1>
    <tr><th>Student ID</th><th>Grade</th><th>Apply Recorrection</th>
    <tr><td>RS211</td><td>C</td><td>Click Here</td></tr>
    <tr><td>RS221</td><td>B</td><td>Click Here</td></tr>
        <tr><td>RS251</td><td>F</td><td>Click Here</td></tr>
</table>​

JS代码:

$("table td:nth-child(3)").hide();​

演示代码链接: http://jsfiddle.net/ELRpv/4/

帮我编辑此代码以完成任务...

解决方案

三件事:

1)您将要关闭"第一行中的TR元素.

2)您也可以定位第一行中的TH元素:

$("table td:nth-child(3), table th:nth-child(3)").hide();  

3)如果您可以将显示日期"添加为数据日期属性，则可以使用某些JS计算今天和显示日期之间的差值.

<table border=1 data-date="2012-12-01">
    <tr><th>Student ID</th><th>Grade</th><th>Apply Recorrection</th></tr>
    <tr><td>RS211</td><td>C</td><td>Click Here</td></tr>
    <tr><td>RS221</td><td>B</td><td>Click Here</td></tr>
    <tr><td>RS251</td><td>F</td><td>Click Here</td></tr>
</table>​

// Today
var time_now = $.now();

// The date set in the table's data-date.
var date_start = new Date($('table').attr('data-date'));

// The table's date turned into microseconds.
var time_start = date_start.getTime();

// The difference in days.
var date_difference = parseInt((time_now - time_start ) / (86400000));

// If the date difference is greater than X, hide the column.
if(date_difference > 12){
    $("table td:nth-child(3), table th:nth-child(3)").hide();    
}

此处的工作示例:

http://jsfiddle.net/hansvedo/TuLMC/

I have table called view results in my db.it has 3 columns.. I want hide its 3rd column 'Apply Recorrection ' after 14 days.Example : Table show date is 2012-12-01.After 14 days how can I hide this 3rd column (IN 2012-12-15 table will not visible to students who refer this table..).... Here is my sample code:

<table border=1>
    <tr><th>Student ID</th><th>Grade</th><th>Apply Recorrection</th>
    <tr><td>RS211</td><td>C</td><td>Click Here</td></tr>
    <tr><td>RS221</td><td>B</td><td>Click Here</td></tr>
        <tr><td>RS251</td><td>F</td><td>Click Here</td></tr>
</table>​

JS code:

$("table td:nth-child(3)").hide();​

Demo code link: http://jsfiddle.net/ELRpv/4/

Help me to edit this code to do my task...

解决方案

Three things:

1) You'll want to "close" the TR element in the first row.

2) You can target the TH elements in the first row as well:

$("table td:nth-child(3), table th:nth-child(3)").hide();  

3) If you can add the "show date" as a data-date attribute then using some JS you can calculate the difference between today and show date.

<table border=1 data-date="2012-12-01">
    <tr><th>Student ID</th><th>Grade</th><th>Apply Recorrection</th></tr>
    <tr><td>RS211</td><td>C</td><td>Click Here</td></tr>
    <tr><td>RS221</td><td>B</td><td>Click Here</td></tr>
    <tr><td>RS251</td><td>F</td><td>Click Here</td></tr>
</table>​

// Today
var time_now = $.now();

// The date set in the table's data-date.
var date_start = new Date($('table').attr('data-date'));

// The table's date turned into microseconds.
var time_start = date_start.getTime();

// The difference in days.
var date_difference = parseInt((time_now - time_start ) / (86400000));

// If the date difference is greater than X, hide the column.
if(date_difference > 12){
    $("table td:nth-child(3), table th:nth-child(3)").hide();    
}

Working sample here:

http://jsfiddle.net/hansvedo/TuLMC/

这篇关于在特定日期使用jquery隐藏表列的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！