Question

如果Ajax调用成功，我有一个表格，其中一行设置为某种背景颜色。我需要能够在下一个Ajax操作中清除背景颜色，因此只有更新的最后一行才有背景设置。使用jQuery的示例表行：

$(document).ready(function() {
  $('.update-allocation').click(function(event) {
    var $row = $(this).parents('tr');
    var desc = $row.find('input[name="item.Description"]').val();
    var gift = $row.find('input[name="item.GiftAidable"]').is(':checked');
    var isActive = $row.find('input[name="item.IsActive"]').is(':checked');

    $row.closest('table').children('td').removeAttr("background-color")
    $row.parent().find('td').removeAttr("background-color")

    $row.children().css({
      "background-color": "green"
    });

  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tr>
    <td>
      <input id="item_AllocationId" name="item.AllocationId" type="hidden" value="3">
      <input class="form-control input-width-medium text-box single-line" data-val="true" data-val-required="The Description field is required." id="item_Description" name="item.Description" type="text" value="Donation Box">
    </td>
    <td>
      <div class="checker" id="uniform-item_GiftAidable"><span class="checked"><input checked="checked" class="uniform checkbox" id="item_GiftAidable" name="item.GiftAidable" type="checkbox" value="true"></span>

      </div>
      <input name="item.GiftAidable" type="hidden" value="false">
    </td>
    <td>
      <div class="checker" id="uniform-isActive"><span class="checked"><input checked="checked" class="uniform checkbox" id="isActive" name="item.IsActive" type="checkbox" value="true"></span>

      </div>
      <input name="item.IsActive" type="hidden" value="false">
    </td>
    <td>
      <input class="update-allocation" type="submit" name="update-allocation" value="Update" />
    </td>
  </tr>
</table>

在这里摆弄JSFiddle

Answer 1

StringIO

应该做的伎俩

https://jsfiddle.net/owoze110/8/

我建议使用这门课程。

将类添加到活动行并使用css规则设置$(document).ready(function () { $('.update-allocation').click(function (event) { var $row = $(this).parents('tr'); var desc = $row.find('input[name="item.Description"]').val(); var gift = $row.find('input[name="item.GiftAidable"]').is(':checked'); var isActive = $row.find('input[name="item.IsActive"]').is(':checked'); $row.closest('table').find('td').css({'background-color': 'inherit'}) $row.children().css({"background-color":"green"}); //alert('description: ' + desc + '\ngift aidable: ' + gift + '\nis active: '+isActive); }); });

Answer 2

你正在应用background-color作为样式并删除属性所以它不会起作用而你应该删除样式的属性

$row.closest('table').find('td').removeAttr( "style" );

jsfiddle

jQuery - 如何在表中导航并删除属性，

2 个答案: