Question

我有一堆partialViews的表，这些表是使用ajax加载的。

现在，我想编写一个全局函数，当某人单击tablerow时，background-color变成橙色，而选择其他tablerow时，旧的变成白色，然后新的变成橙色。

所以我在_Layout.cshtml的底部写了这个：

<script type="text/javascript">
    $(document).ready(function() {
        $("table tbody tr").on('click', function () {
            var selected = $(this).hasClass("selectedTableRow");
            $("table tbody tr").removeClass("selectedTableRow");
            if (!selected)
                $(this).addClass("selectedTableRow");
        });
    });
</script>

，但根本无法实现，我在该函数中放置的console.logs或alerts并未被触发。为什么不呢？

我的桌子都具有标准设置

<table>
<thead>
    <tr>
        <th></th>
    </tr>
</thead>
<tbody>
    <tr>
        <td></td>
    </tr>
</tbody>
<tfoot>

</tfoot>
</table>

Answer 1

您正在动态创建表格，因此请使用文档中的.on来绑定点击事件，请参见下文

$(document).ready(function() {
        $(document).on('click',"table tr", function () {
            var selected = $(this).hasClass("selectedTableRow");
            $("table tr").removeClass("selectedTableRow");
            if (!selected)
                $(this).addClass("selectedTableRow");
        });
    });

Answer 2

$(document).ready(function() {
    $("body").on('click', "table tr", function () {
        $("table tr").removeClass("selectedTableRow");
        $(this).addClass("selectedTableRow");
    });
});

更改桌面选择的背景色

2 个答案: