Ver Mensaje Individual
  #1 (permalink)  
Antiguo 24/12/2012, 08:02
Avatar de fast_10
fast_10
 
Fecha de Ingreso: abril-2010
Ubicación: Desde aquí o desde allá
Mensajes: 16
Antigüedad: 14 años, 8 meses
Puntos: 0
addClass, removeClass problema con <tr>

buenas,

asi como menciona el titulo las funciones addClass y removeClass no me funcionan para filas ingresadas con el append de jquery, tengo una lista de registros que se cargan de la base de datos y agregan con la funcion de acontinuacion, que funciona bien

Código Javascript:
Ver original
  1. $("#lista tbody").append("<tr>" +
  2.                                     "<td>" + variable_js1+ "</td>" +
  3.                                     "<td>" + variable_js2 + "</td>" +
  4.                                     "<td> <img src='../imagenes/holi.jpg'>" +
  5.                                 "</tr>");

ahora necesito cambiar el fondo de color de la fila donde este el mouse, para eso agregue este estilo:

Código Javascript:
Ver original
  1. .tr_hover {
  2.                 background-color: #0073EE;
  3.                 color:#fff;
  4.  
  5.             }

y agregue en el document.ready lo siguiente

Código Javascript:
Ver original
  1. $("#lista tbody tr").mouseover(function () {
  2.                     $(this).addClass("tr_hover");
  3.  });
  4.  
  5.  $("#users tbody tr").mouseout(function () {
  6.                     $(this).removeClass("tr_hover");
  7. });

ahora para testear, agregue una fila a directamente, y para mi sopresa esta si cambia de color el fondo cuando el mouse esta sobre la fila.

Código HTML:
Ver original
  1. <table id="users" class="ui-widget ui-widget-content">
  2.         <thead>
  3.             <tr class="ui-widget-header ">
  4.                 <th>titulo 1</th>
  5.                 <th>titulo 2</th>
  6.                 <th>titulo 3</th>
  7.                
  8.             </tr>
  9.         </thead>
  10.        <tbody>
  11.             <tr>
  12.                 <td>no dinamico</td>
  13.                 <td>no dinamico</td>
  14.                 <td>no dinamico</td>
  15.                </tr>
  16.        </tbody>
  17.         <tfoot>
  18.             <tr>
  19.                 <td colspan="3">
  20.                     contador o cualquier cosa en el foot que me tinque
  21.                 </td>
  22.             </tr>
  23.         </tfoot>
  24.     </table>

ahora mi duda es porque las filas agregadas con el append no cambian de clase, quizás ahi una regla de jquery que desconsca, en realidad no soy muy experto en el tema, pero me gustaría que alguien me ayudará desde ya muchas gracias por su tiempo y ayuda

como dato adicional mencionar que revise el html que se generaba y las filas del append que se agregaban estan entre el tbody obviamente.