Question

我想在用户点击行中添加class="selected"属性，并从其他兄弟中删除此属性。因为我会在单击按钮时通过其class属性获取此行。我已经尝试了很多j查询，但没有j查询正在工作。请给我一个可以帮助我的解决方案。

这是关于加载页面的表格

<table id="saptable">
        <thead>
            <tr>
                <th>Item Name</th>
                <th>Item Code</th>
                <th>SAP Quantity</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>121</td>
                <td>register121</td>
                <td>34344</td>
            </tr>
        </tbody>
</table>

Answer 1

＆＃13;

YES

＆＃13;

$('tr').click(function() {
  $('tr').removeClass('selected'); //remove the class from all tr
  $(this).addClass('selected'); //add to clicked tr

})

＆＃13;

.selected {
  background-color: red
}

＆＃13;

Answer 2

您可以先从所有tr中删除class，然后添加到当前。

$('#saptable tbody tr').click(function(){
    $('#saptable tbody tr').removeClass('selected');
    $(this).addClass('selected');
});

您可以保留最后选择的行，只删除此行中的选定内容，而不是从所有行中删除。这将是更有效的解决方案。

$prevRow = null;
$('#saptable tbody tr').click(function(){
    if($prevRow != null)  
          $prevRow.removeClass('selected');
    $(this).addClass('selected');
    $prevRow = $(this);
});

Answer 3

使用jQuery：

Error in as.data.frame.default(x[[i]], optional = TRUE, stringsAsFactors = stringsAsFactors) :   cannot coerce class ""Sparte"" to a data.frame

jsFiddle

Answer 4

您可以通过以下方式执行此操作：

＆＃13;

var lastSelected;

$("table tr").click(function() {
  $(lastSelected).removeClass("selected");
  $(this).addClass("selected");
  lastSelected = this;
});

＆＃13;

$(document).ready(function() {
  $("#saptable tr").click(function() {
    $(this).addClass("selected").siblings().removeClass("selected");
  });
});

＆＃13;

.selected {
  background: gray
}

＆＃13;

Answer 5

有一种siblings()方法可以搜索兄弟姐妹。

$("#saptable tbody > tr").click(function() {
  $(this).addClass("selected").siblings().removeClass("selected");
});

我想在表行中添加一个class属性，并通过jquery从其他兄弟行中删除该属性

5 个答案: