Question

使用jQuery，如何在表中包含具有特定文本的span的行数？

例如，从下表中，我如何计算跨度为“用户”的行数？

<table class="table table-striped table-hover table-condensed" id="CorrectionCodesList">
    <tr>
        <td>            
            <span class="label label-primary">Print</span>
            Zoning is not answered
        </td>
    </tr>              

    <tr>
        <td>            
            <span class="label label-primary">User</span>
            Vehicle Type is required
        </td>
    </tr>              

    <tr>
        <td>            
            <span class="label label-primary">Do Not Print</span>
            Business Phone Number is required
        </td>
    </tr>              

    <tr>
        <td>            
            <span class="label label-primary">Print</span>
            Business Email Address is required
        </td>
    </tr>
</table>

Answer 1

您可以在TD上使用过滤器来查看它们是否包含带文字的跨度（）==＆＃34;用户＆＃34;等：

JSfiddle：http://jsfiddle.net/TrueBlueAussie/6JW3M/

var $rows = $('#CorrectionCodesList tr').filter(function(){
    return $(this).find('td span').text() == "User";
});
alert($rows.length);

注意：此特定逻辑假定仅在TD内部有1个跨度，因为find().text()将仅返回第一个匹配的文本。

Littel update：我倾向于使用范围的jQuery选择器，因为它们通常会产生更短的代码，例如：

var $rows = $('#CorrectionCodesList tr').filter(function(){
    return $('td span',this).text() == "User";
});
alert($rows.length);

Answer 2

~~最简单的解决方案是使用:has和:contains()：~~

您可以使用:has和:contains()：

var numberOfTr = $('tr:has(span:contains(User))').length

然而，它区分大小写，并且＆＃34;用户界面＆＃34; 等词匹配......

您应该使用tr上的过滤器进行限制性更强的匹配：

var $tr = $('tr').filter(function(){
    return $.trim($(this).find('span').text()).toLowerCase() === 'user'
});

alert($tr.length)

http://jsfiddle.net/Mfx8S/

计算表中包含特定范围的行

2 个答案:

JSfiddle：http://jsfiddle.net/TrueBlueAussie/6JW3M/