Question

有什么其他方式来编写以下内容。我有一个3行的表。每行都有一个包含3个复选框的列和另一个只包含文本框的列。

我想要发生的是从数据库加载值时，如果一行检查了任何复选框或其文本框不等于空白突出显示该行。

<table border="1" id="distributionTable">
<tr>
<td>Full Run</td>
<td><input type="checkbox" class="deliveryAction" name="Collection[0].IsHome" /> H
<input type="checkbox" class="deliveryAction" name="Collection[0].IsRack" /> R
<input type="checkbox" class="deliveryAction" name="Collection[0].IsRunOut" /> O</td>
<td><input type="text" name="Collection[0].Quantity" class="quantity" /></td>
</tr>

<tr>
<td>City Zones</td>
<td><input type="checkbox" class="deliveryAction" name="Collection[1].IsHome" /> H
<input type="checkbox" class="deliveryAction" name="Collection[1].IsRack" checked="checked" /> R
<input type="checkbox" class="deliveryAction" name="Collection[1].IsRunOut" /> O</td>
<td><input type="text" name="Collection[1].Quantity" class="quantity" /></td>
</tr>

<tr>
<td>12345</td>
<td><input type="checkbox" class="deliveryAction" name="Collection[2].IsHome" /> H
<input type="checkbox" class="deliveryAction" name="Collection[2].IsRack" /> R
<input type="checkbox" class="deliveryAction" name="Collection[2].IsRunOut" /> O</td>
<td><input type="text" name="Collection[2].Quantity" class="quantity" value="1000" /></td>
</tr>

</table>

这是我写的jquery：

$('#distributionTable tr').each(function(){ 
    $this = $(this);

    var hascheck = false;
    $this.find('.deliveryAction').each(function(){
        if (this.checked){
            hascheck = true;
            return false;
        }
    });

    if (hascheck)
    {
        $(this).css('background-color', 'red');
    }


    if ($this.find('.quantity').val() != ''){
        $(this).css('background-color', 'orange'); 
    }
});

Answer 1

据推测，HTML是在服务器上生成的，服务器已经知道检查了哪些复选框或输入有值，所以只需在突出显示它的行中添加一个类。

Answer 2

你可以这样做（假设每行有一个文本输入）：

$('#distributionTable tr').filter(function() {
   var $this = $(this);
    if($this.find(':checked').length != 0)
        return true;
    if($.trim($this.find(':text').val()) != '')
        return true;
    return false;
}).addClass('hi');

演示：http://jsfiddle.net/ambiguous/XXBWP/

已检查和文本框的扫描表不为空

2 个答案: