jQuery 更改 tr 背景颜色
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1821175/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Change tr background-color
提问by user158625
I have something like this:
我有这样的事情：
<tr id='<%=currentRow %>' onclick="SetBackgroundColor(this)" style="background-color:Yellow">
When i click on a row i want to change its background color and i did like this:
当我单击一行时，我想更改其背景颜色，我这样做了：
function SetBackgroundColor(rowId)
{
$(rowId).css("background-color", "#000000");
}
but i don't know why it doesn't work. Any suggestions please?
但我不知道为什么它不起作用。请问有什么建议吗？
回答by David Hellsing
IE has a problem with background colors for the TR element. A more safe way is to set background to the TD's and TH's inside the TR:
IE 的 TR 元素的背景颜色有问题。更安全的方法是将背景设置为 TR 内的 TD 和 TH：
<table id="tabletest">
<tr>
<td>testcell</td>
</tr>
</table>
<script>
$('#tabletest tr').bind('click', function(e) {
$(e.currentTarget).children('td, th').css('background-color','#000');
})
</script>
Added: you can assign a single event handler for the entire table to increase performance:
添加：您可以为整个表分配单个事件处理程序以提高性能：
$('#tabletest').bind('click', function(e) {
$(e.target).closest('tr').children('td,th').css('background-color','#000');
});
回答by Vincent Ramdhanie
In jQuery you do not have to use the onclick attribute to assign an event handler. Lets say you add a class called mytr to each tr that you want to affect. Then you can do something like this:
在 jQuery 中，您不必使用 onclick 属性来分配事件处理程序。假设您向要影响的每个 tr 添加一个名为 mytr 的类。然后你可以做这样的事情：
$(document).ready(function(){
$(".mytr").click(function(){
$(this).css("background-color", "#000000");
});
});
And that will apply the event handler to all rows with the class mytr.
这会将事件处理程序应用于类 mytr 的所有行。
回答by luckykind
This will reset each row upon clicking a new one...
这将在单击新行时重置每一行...
$(document).ready(function(){
$('tr').click(function(){
$('tr td').css({ 'background-color' : 'green'});
$('td', this).css({ 'background-color' : 'red' });
});
});
demo: http://jsbin.com/aciqi/
回答by Raj
$('#RowID').children('td, th').css('background-color','yellow');
回答by Pauly
A simpler solution is to probably use a selector for all rows in the table or addClass.
一个更简单的解决方案是可能对表或 addClass 中的所有行使用选择器。
Example
例子
$("#myTable tr").click(function() {
$(this).css('background-color', '#f00');
});
or
或者
$("#myTable tr").click(function() {
$(this).addClass('selected');
});
回答by user158625
Thank you all..the problem was that in the masterpage i was loading the jquery-1.3.2.min.jsbeforequery-1.3.2-vsdoc.jsand that's way it wasn't working..thanks again
谢谢大家..问题是在母版页中我正在加载 j query-1.3.2.min.jsbeforequery-1.3.2-vsdoc.js，这就是它不起作用..再次感谢
回答by Jordan Ryan Moore
Instead of changing the table row background color, try changing the table cell background color.
不要更改表格行背景颜色，而是尝试更改表格单元格背景颜色。
$(document).ready(function() {
$(".mytr td").click(function() {
$(this).css("background-color", "#000000");
});
});
