Hola nuevamente
satjaen.
Cita:
Iniciado por satjaen 
@gebremswar, no me sale ....
En realidad ya lo sabía
. Si probaste el ejemplo de mi mensaje anterior con contenido estático podrás darte cuenta que funciona perfectamente, pero el detalle está en ..........
Cita:
Iniciado por satjaen (...) no se si puede ser por el contenido dinámico:
Así es, lo ocasiona el contenido dinámico. Y esto es porque los elementos con clase ".row" aun no están presentes cuando el "ready" de jquery se ejecutó y comprobó que el DOM ha sido cargado y puede ser manipulado.
Es entonces que debemos definir selectores a partir de los presentes en el contenido estático. Por ejemplo podemos hacer referencia al body ya que sabes que esta presente en el contenido estático y partir de allí definir los descendientes que dispararán el evento.
Pero para este ejemplo que compartiré, no hace falta ir tan "arriba" en busca del padre que estará presente como es el caso de <body>. Ya que podemos definir un id en la tabla y a partir de el crearemos nuestro selector.
Código Javascript
:
Ver original<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>@GBreagan</title>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script>
$(document).on('ready', function(){
$('#list').on('click', '.row', function(){
var $checkbox = $(this).find('.check');
if ($checkbox.prop('checked')) {
$checkbox.prop('checked', false);
$(this).removeClass('selected')
} else {
$checkbox.prop('checked', true);
$(this).addClass('selected')
}
});
$('#list').on('click', '.row .check', function(event){
event.stopPropagation();
$(this).parents('.row').toggleClass('selected');
});
//Esto solo es de ejemplo para agregar contenido dinámico
$('#add').on('click', function(){
$('#list tbody').append('<tr class="row"><td><input type="checkbox" class="check"></td><td>fdw</td></tr>');
});
});
</script>
<style>
table {border-collapse:collapse;border-spacing:0}
th, td {border:1px solid black;cursor:default}
.row:hover {background-color:#E7E7E7}
.row.selected {background-color:#0072C6;color:white}
</style>
</head>
<body>
<input type="button" value="add row" id="add">
<table id="list">
<thead>
<tr>
<th>*</td>
<th>Name</td>
</tr>
</thead>
<tbody>
<tr class="row">
<td><input type="checkbox" class="check"></td>
<td>gebremswar</td>
</tr>
<tr class="row">
<td><input type="checkbox" class="check"></td>
<td>satjaen</td>
</tr>
</tbody>
</table>
</body>
</html>
Como puedes observar el cambio es mínimo (bueno, eliminé también los eventos mouseenter y mouseleave por lo que te comenté en el mensaje anterior).
En el ejemplo se puede apreciar como se asocia el selector dentro del propio cuerpo de la función para especificar el desentiende que disparará el evento. Para nuestro caso la clase .row a partir de su padre #list. Y para el checkbox ".row .check".
<!-- edit-->
Casi lo olvido. Es posible que en otros lugares (foros o blog's) encuentres solución al pequeño inconveniente descrito en este mensaje, referente al contenido dinámico, tratado con el método .live() de JQuery. Y es por eso que te dejo un articulo el cual recomienda no utilizarlo:
Porqué no debemos usar nunca jQuery Live <!--/edit--> Cita:
Iniciado por satjaen Gracias
De nada