Question

我正在尝试将输入字段中的日期与表格中显示的日期进行比较。但是，当匹配时，它会隐藏所有tds并删除列，如果我使用.parent（）它会在匹配时隐藏所有trs，所以我有一个空表。

jQuery：

$('[name="dateFrom"]').on("change", function () {
    var dateFrom = new Date($(this).val());
    var conditionDateFrom = $('td[name="tdDateFrom');
    conditionDateFrom.hide();
    conditionDateFrom.filter(function () {
        return dateFrom < new Date(conditionDateFrom.html());
    }).show();

});

输入：

<input name="dateFrom" type="date" value="2016-01-01" />

我想要匹配的td

<td name="tdDateFrom">{{ a.StartDate | date:'longDate'}}</td>

我只想隐藏与td匹配的一个tr。

由于

无法让jsfiddle工作，但这里是控制台+表格的屏幕

表：http://imgur.com/BWecBdn

登录http://imgur.com/bMwGDpd

时的控制台

        var test = new Date(conditionDateFrom.html());
        console.log(test);

似乎只是在检查第一个tr的条件？

JSFiddle https://jsfiddle.net/jp3jf25a/类似于我的代码，但是对于我而言，表格受到影响，无法让它在小提琴上工作

Answer 1

Working fiddle

各种问题：

使用conditionDateFrom.html()隐藏所有tds，而应使用$(this).text()。
过滤trs not tds，你想要隐藏不匹配的行而不是隐藏单独的tds
跳过第一个tr，因为那是表格标题
使用<=而非<，因为应显示相同的日期
输入为空白时应处理（应再次显示）

更新的代码：

$('[name="dateFrom"]').on("change", function () {
    var conditionDateFrom = $('.table tr');

    if($(this).val() == ''){
        conditionDateFrom.show();
        return;
    }

    var dateFrom = new Date($(this).val());

    conditionDateFrom.hide();
    conditionDateFrom.filter(function (index) {
        return index == 0 || dateFrom <= new Date($(this).children('td[name="tdDateFrom"]').text());
    }).show();
});

Answer 2

让我们分解你的问题，你想只隐藏第一场比赛我想但是你取而代之的是所有的比赛。$('td[name="tdDateFrom')将取得你所有的比赛而不是你只能得到第一场比赛$('td[name="tdDateFrom').first()。

`$('td[name="tdDateFrom').first().parent('tr')` will return you only the one matched tr element.

这里更新了小提琴https://jsfiddle.net/jp3jf25a/1/

Answer 3

我认为这应该可以选择合适的tr。

var inputValue = $(input).attr('value') //'2016-01-01'
var conditionDateFrom = $("td:contains(inputValue)").parent()

http://api.jquery.com/contains-selector/

在意识到你想要父母tr之后编辑（我想？）

jQuery隐藏所有trs或tds而不只是一个

3 个答案: