2010-12-28 17 views
5

Ho una tabella e non posso cambiare marcatura:jQuery eliminare colonna della tabella

<table> 
    <thead> 
     <tr> 
      <th> 
       blablabla 
      </th> 
      <th> 
       blablabla 
      </th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td> 
       efgd 
      </td> 
      <td> 
       efghdh 
      </td> 
     </tr> 
    </tbody> 
</table> 

Qui è la mia funzione, che dovrebbe eliminare una colonna. È chiamato sul clic della cella:

function (menuItem, menu) { 
    var colnum = $(this).prevAll("td").length; 

    $(this).closest('table').find('thead tr th:eq('+colnum+')').remove(); 
    $(this).closest("table").find('tbody tr td:eq('+colnum+')').remove();  
    return; 
} 

Ma elimina qualcos'altro, non la colonna che volevo eliminare. Dove mi sbaglio?

+0

Non riesco a vedere la vostra intenzione qui, si prega di dare più specifiche ific. Vuoi cancellare tutto o solo colonne specifiche? –

risposta

12

Una colonna è praticamente solo celle, quindi è necessario eseguire manualmente il ciclo di tutte le righe e rimuovere la cella dall'indice.

Questo dovrebbe dare un buon punto di partenza per la rimozione della terza colonna:

$("tr").each(function() { 
    $(this).filter("td:eq(2)").remove(); 
}); 
+0

Questo non funziona. 'filter()' viene applicato agli elementi 'tr', non agli elementi' td', quindi questo non rimuove nulla. Invece devi fare '$ (this) .children(). Filter()' o meglio '$ (this) .find()'. – Mike

7

Questo utilizza .delegate() per il gestore, e un approccio più nativa utilizzando cellIndex per ottenere l'indice delle cellule che è stato cliccato, e cells tirare la cella da ogni riga.

Esempio:http://jsfiddle.net/zZDKg/1/

$('table').delegate('td,th', 'click', function() { 
    var index = this.cellIndex; 
    $(this).closest('table').find('tr').each(function() { 
     this.removeChild(this.cells[ index ]); 
    }); 
}); 
5

Questo funziona bene per me:

$(".tableClassName tbody tr").each(function() { 
    $(this).find("td:eq(3)").remove(); 
}); 
0

Rimuovere la prima colonna di ogni riga.

$('.mytable').find("tr td:nth-child(1)").each(function(){ 
    $(this).remove() 
}); 
1

Se ha l'html statico (non tabella con 10 colonne),

quindi rimuovere la prima colonna insieme intestazione usando sotto:

$('#table th:nth-child(1),#table td:nth-child(1)').remove(); 

ora la nuova tabella avrà 9 colonne, ora è possibile rimuovere qualsiasi colonna utilizzando il numero:

$('#table th:nth-child(7),#table td:nth-child(7)').remove(); 
Problemi correlati