2009-11-30 30 views
15

que tiene algo como esto:Cambio tr background-color

<tr id='<%=currentRow %>' onclick="SetBackgroundColor(this)" style="background-color:Yellow"> 

Cuando hago clic en una fila quiero cambiar su color de fondo y lo hice así:

function SetBackgroundColor(rowId) 
{ 
    $(rowId).css("background-color", "#000000"); 
} 

pero Don No sé por qué no funciona. Alguna sugerencia por favor?

+0

¿Sucede algo? Intente usar Firebug o algunas líneas de "alerta" para restringir si el evento click está incluso activando, qué se está pasando a la función, etc. –

+0

También puede crear una clase CSS y aplicar la clase a su TR con el javascript. – Roch

+0

Ver para una fila haga clic en demo http://jsbin.com/ufihi3 – Pool

Respuesta

30

IE tiene un problema con los colores de fondo para el elemento TR. Una forma más segura es establecer antecedentes de la TD de y TH del interior de la TR:

<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> 

Agregado: puede asignar un único controlador de eventos para toda la tabla para aumentar el rendimiento:

$('#tabletest').bind('click', function(e) { 
    $(e.target).closest('tr').children('td,th').css('background-color','#000'); 
}); 
7

En jQuery no tiene que utilizar el atributo onclick para asignar un controlador de eventos. Digamos que agregas una clase llamada mytr a cada tr que quieras afectar. A continuación, puede hacer algo como esto:

$(document).ready(function(){ 
     $(".mytr").click(function(){ 
      $(this).css("background-color", "#000000"); 
     }); 
}); 

y que va a aplicar el controlador de eventos para todas las filas con el mytr clase.

+0

no pasa nada ... uso firebug para mirar ... salta donde tiene que ... pero nada ... todavía amarillo fila – user158625

+0

¿Está modificando esto por lo que utiliza el selector correcto? – Kezzer

0

En lugar de cambiar el color de fondo de la fila de la tabla, intente cambiar el color de fondo de la celda de la tabla.

$(document).ready(function() { 
    $(".mytr td").click(function() { 
     $(this).css("background-color", "#000000"); 
    }); 
}); 
1

Una solución más simple es probablemente utilizar un selector para todas las filas de la tabla o addClass.

Ejemplo

$("#myTable tr").click(function() { 
    $(this).css('background-color', '#f00'); 
}); 

o

$("#myTable tr").click(function() { 
    $(this).addClass('selected'); 
}); 
6

Esta voluntad restablecer cada fila al hacer clic en una nueva ...

$(document).ready(function(){ 

    $('tr').click(function(){ 
    $('tr td').css({ 'background-color' : 'green'}); 
    $('td', this).css({ 'background-color' : 'red' }); 
    }); 

}); 

demo: http://jsbin.com/aciqi/

0

Gracias all..the problema era que en el masterpage i Estaba preparando el j query-1.3.2.min.jsbeforequery-1.3.2-vsdoc.js y eso es así no era working..thanks nuevo

+0

Seleccione una respuesta para que sepamos que tiene una solución. – Mottie

2
$('#RowID').children('td, th').css('background-color','yellow'); 
Cuestiones relacionadas