Question

我有一个像这样的表结构

            <table id="oustandingItems">
            <thead>
                <tr><th>Category</th>
                <th>Details</th>
                <th></th>
            </tr></thead>
            <tbody>
                <tr>
                    <td>
                        <select id="OICategory">
                             <option value="1">Fault</option>
                             <option value="2">Shortage</option>
                             <option value="3">Retorfit</option>
                             <option value="4">Labour</option>
                             <option value="5">Other</option>
                         </select>
                    </td>
                    <td><textarea id="OIDetails" rows="3" cols="62"></textarea></td>
                    <td><button id="addNewRow" class="addbutton">>Add</button></td>
                </tr>
                <tr>
                    <td>&nbsp;</td>
                    <td class="detailsCounter textareacounter">185 characters remaining</td>
                    <td>&nbsp;</td>
                </tr>
            <tr>
                <td class="evenrow">Fault</td>
                <td class="evenrow">ghgfhgfhgfhgfh</td>
                <td class="butCell evenrow">
                    <button class="removeitem">Remove</button>
                </td>
            </tr>
            <tr>
                <td class="oddrow">Fault</td>
                <td class="oddrow">cvbcvbcvbcvbcvb</td>
                <td class="butCell oddrow">
                    <button class="removeitem">Remove</button>
                </td>
            </tr>
         </tbody>
        </table>

我试图用这段代码从奇数行和偶数行的前两个td中检索数据

$(document).ready(function() {
var tableHeader = $('#oustandingItems');
var tds = $('#oustandingItems td.evenrow, #oustandingItems     td.oddrow').filter(function(index) {
    alert($(this).not('button.removeitem').html());
});
});

但我没有得到正确的输出，任何人都可以提出我之所以返回Button单元以及前两个单元格的原因。

JSFiddle Example

Answer 1

您正在使用filter方法，但实际上不会过滤元素，您可以使用not方法：

$(document).ready(function() {
  var $tableHeader = $('#oustandingItems');
  var $tds = $tableHeader.find('td.evenrow, td.oddrow').not('.butCell').each(function(){
      // alert($(this).text())
  })
});

http://jsfiddle.net/8rSLC/

您可以使用缓存对象和find方法，这比重新查询DOM更有效。请注意，使用button.removeitem不会过滤您的td元素。

Answer 2

尝试将此添加到您的选择器：

button:not(.removeitem) ,

即。排除你的按钮：

var tds = $('#oustandingItems td.evenrow, #oustandingItems td.oddrow button:not(.removeitem)').filter(function(index)

请参阅jQuery选择器文档here。

从表jquery中检索已过滤的单元格数据

2 个答案: