我有一堆表格作为 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 都有标准设置
<table>
<thead>
<tr>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
<tfoot>
</tfoot>
</table>
最佳答案
您正在动态创建表,因此使用带有 .on
的文档绑定(bind)点击事件,见下文
$(document).ready(function() {
$(document).on('click',"table tr", function () {
var selected = $(this).hasClass("selectedTableRow");
$("table tr").removeClass("selectedTableRow");
if (!selected)
$(this).addClass("selectedTableRow");
});
});
关于javascript - 更改表格行选择的背景颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51892731/