根据相邻单元格中的值有条理地隐藏表格中的单元格

时间:2013-02-13 15:08:50

标签: jquery html formatting

我正在使用第三方网格来显示一些数据而且我对它产生的标记没有任何控制权

在下面的示例中,我想隐藏相邻单元格没有值的行的提交按钮(即下例中的中间行)

我认为这可以通过jQuery实现,但我有点不知道如何有条件地做事情

<div id="grid">
    <table>
        <tr>
            <td>123</td><td><a href="/go/somewhere">Submit</a></td>
        </tr>
        <tr>
            <td></td><td><a href="/go/somewhere">Submit</a></td>
        </tr>
        <tr>
            <td>123</td><td><a href="/go/somewhere">Submit</a></td>
        </tr>
    </table>
<div>

任何想法?

3 个答案:

答案 0 :(得分:1)

我认为这应该有效,我已经在http://jsfiddle.net/Bu5eZ/尝试了,并且它按预期工作。

var cells = $("table tr td:first-child");

cells.each(function(i){
    if ($(this).text() === ''){
         $(this).next().find('a').hide();
    }
});

答案 1 :(得分:1)

您可以使用.filter() jQuery方法,在其中插入自己的逻辑。

$('a').filter(function () {
    return $(this).closest('tr').find('td:first-child').html() === '';
}).hide();

最后链接一个简单的.hide()

编辑,更改为 td:first-child ,加快速度。

答案 2 :(得分:1)

演示:http://jsfiddle.net/ChgMx/1/

$("#grid a").each(function(i,k){
    if($(k).parent().prev().text().length == 0) $(k).hide();
});