Tema: trabajar con tablas en jquery
Ver Mensaje Individual
  #3 (permalink)  
Antiguo 06/12/2011, 11:35
Avatar de livemusic
livemusic
 
Fecha de Ingreso: abril-2011
Ubicación: Lima - Chorrillos
Mensajes: 150
Antigüedad: 13 años, 6 meses
Puntos: 18
Respuesta: trabajar con tablas en jquery
, me dio curiosidad resolver tu juego y me salio de la siguiente manera ..

Código HTML: 
Ver original
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head>
  4. <title></title>
  5. <meta name="" content="">
  6. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  7. <script type="text/javascript">
  8. $(function(){   
  9.     // click a la celda
  10.     $("#live td").click(function(){
  11.         // obtenemos el valor de la celda
  12.         var val = $(this).attr("title");
  13.         // recorremos la tabla para buscar
  14.         $("#live td").each(function(){
  15.             // obtenemos el valor de la celda 
  16.             var compara = $(this).attr("title");
  17.             // comparamos el valor de la celda de busqueda, con el valor de la celda almacenada
  18.             if(val == compara){
  19.                 // muestra el valor de la celda comparada
  20.                 $(this).html(compara);
  21.             }
  22.         })
  23.         // muestra el valor de la celda
  24.         $(this).html(val);
  25.     })  
  26. })
  27. </script>
  28. <style type="text/css">
  29. #live{ border: 1px solid; }
  30. #live td{ width:15px; height:15px; border: 1px solid; }
  31. </style>
  32. </head>
  33. <body>
  34. <table id="live">
  35.     <tr>
  36.         <td title="2"></td>
  37.         <td title="6"></td>
  38.     </tr>
  39.     <tr>
  40.         <td title="3"></td>
  41.         <td title="1"></td>
  42.     </tr>
  43.     <tr>
  44.         <td title="4"></td>
  45.         <td title="2"></td>
  46.     </tr>
  47.     <tr>
  48.         <td title="7"></td>
  49.         <td title="5"></td>
  50.     </tr>
  51.     <tr>
  52.         <td title="6"></td>
  53.         <td title="4"></td>
  54.     </tr>
  55.     <tr>
  56.         <td title="5"></td>
  57.         <td title="3"></td>
  58.     </tr>
  59.     <tr>
  60.         <td title="1"></td>
  61.         <td title="7"></td>
  62.     </tr>
  63. </table>
  64. </body>
  65. </html>

xD .. suerte