Tema: Controlar atributo rowSpan de una tabla a través de javascript
Ver Mensaje Individual
  #5 (permalink)  
Antiguo 21/12/2009, 08:08
quimfv
Colaborador
  
Fecha de Ingreso: marzo-2008
Ubicación: Sabadell
Mensajes: 4.897
Antigüedad: 16 años, 10 meses
Puntos: 574
Respuesta: Controlar atributo rowSpan de una tabla a través de javascript
Javascript distingue mayúsculas de minúsculas...

rowSpan no rowspan


Código HTML: 
Ver original
  1. <html>
  2. <body>
  3. <script language="JavaScript">
  4. function function1() {
  5.     document.getElementById("myTableHeader").rowSpan += 1;
  6. }
  7. function function2() {
  8.     location.reload();
  9. }
  10. </script>
  11. <table width="542" border="10" bordercolor="red" cellpadding="20">
  12.     <tr>
  13.         <th id="myTableHeader">Cell 1</th>
  14.         <th>Cell 2</th>
  15.         <th id="th5">Cell 3</th>
  16.     </tr>
  17.     <tr>
  18.         <th>Cell 4</th>
  19.         <th id="th2">Cell 5</th>
  20.         <th>Cell 6</th>
  21.     </tr>
  22.     <tr>
  23.         <th>Cell 7</th>
  24.         <th>Cell 8</th>
  25.         <th>Cell 9</th>
  26.     </tr>
  27.     <tr>
  28.         <th >Cell 10</th>
  29.         <th >Cell 11</th>
  30.         <th >Cell 12</th>
  31.     </tr>
  32. </table>
  33. <input type="button" value="Span(2) Cell 1" onClick="function1();">
  34. <input type="button" value="Restore" onClick="function2();">
  35. </body>
  36. </html>

Esto hace lo que pides pero, no del todo!!! (he modificado un poco el ejemplo que dan aqui)

Código HTML: 
Ver original
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  2. <html>
  3. <head>
  4. <title>Documento sin t&iacute;tulo</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  6. <script language="JavaScript" type="text/JavaScript">
  7. function frowspan(direccion){
  8. if(direccion=="0"){
  9. document.getElementById("celdalarga").rowSpan+=1;
  10. }else{
  11. document.getElementById("celdalarga").rowSpan-=1;
  12. }
  13. }
  14. </script>
  15.  
  16.  
  17. </head>
  18.  
  19. <body>
  20. <table width="100%" border="1" cellspacing="0" cellpadding="0">
  21.   <tr> 
  22.     <td rowspan="5" id="celdalarga">&nbsp;</td>
  23.     <td>&nbsp;</td>
  24.     <td><input type="button" name="BotEli" value="Eliminar esta"></td>
  25.   </tr>
  26.   <tr> 
  27.     <td>&nbsp;</td>
  28.   </tr>
  29.   <tr> 
  30.     <td>&nbsp;</td>
  31.     <td>&nbsp;</td>
  32.   </tr>
  33.   <tr> 
  34.     <td>&nbsp;</td>
  35.     <td><input type="button" name="Submit2" value="Eliminar esta"></td>
  36.   </tr>
  37.   <tr> 
  38.     <td><input type="button" name="Submit3" value="Agregar una"  onclick="frowspan('0')"></td>
  39.     <td><input type="button" name="veurerowspan" value="Quitar una" onclick="frowspan('1')"></td>
  40.   </tr>
  41. </table>
  42.  
  43. </body>
  44. </html>

Este es mio


Yo me plantearia muy seriamente la opcion que te ha dado CHuLoSoY.

Quim