javascript - 突出显示选定的表格行

Question

我在执行拖放功能时遇到问题。到目前为止 draggable 和 sortable 是可以的。现在的问题是我正在尝试突出显示所选行并使用按钮将其删除。

我有两个表:A 类和 UI 类。我设法突出显示 tr 表类 A。但是在表类 UI 中我无法突出显示 tr。

这是我的 jsfiddle .

非常感谢您的帮助。

Answer 1

您的代码和 CSS 有几个问题:

第一个问题 - 您的 test2 CSS 选择器被设置为仅在具有 A 类的表格下工作:

你的代码:

.A tbody tr.test2 td {
    background: rgba(20, 111, 186, 0.38);
}

我的修复，是通用的:

tbody tr.test2 td {
    background: rgba(20, 111, 186, 0.38);
}

下一期，您的点击从未在第二张 table 上被调用:您的代码(仅在带有 ID 图的表格下):

$('#diagram tbody tr').click(function(e) {
    $('#diagram tbody tr').not(this).removeClass('test2');
    $(this).toggleClass('test2');
});

我的代码(所有表的事件委托(delegate)):

$('tbody').on("click","tr",function(e) {
    $('tbody tr').not(this).removeClass('test2');
    $(this).toggleClass('test2');
});

工作 fiddle : http://jsfiddle.net/jwb7vy9L/9/

使用删除操作:

$("#button1").on("click",function(e){
    $("table:not(.A) .test2").remove();
});

http://jsfiddle.net/jwb7vy9L/14/