Comment redimensionner la largeur des colonnes d'un tableau à partir de JavaScript

Question

J'ai un problème avec javascript.
J'ai une liste de cellules de table stockée dans TabList.
Je souhaite trouver la largeur maximale, puis définir cette largeur pour toutes.
Un exemple de code est ici, mais le réglage de la largeur ne fonctionne pas.

var MaxTabWidth = 0;
for (var i = 0; i < TabList.length-1; i++)
{
  if (TabList[i].offsetWidth>MaxTabWidth) 
    MaxTabWidth = TabList[i].offsetWidth;
}

for (var i = 0; i < TabList.length-1; i++)
{
  TabList[i].style.width = MaxTabWidth+"px";
  // TabList[i].width = MaxTabWidth+"px";
  // TabList[i].offsetWidth = MaxTabWidth+"px";
}

J'ai commenté mes tentatives ..
De l'aide?
Cette n'a pas fait le tour pour moi ..

mise à jour:
Je suis sûr que TabList est une liste de cellules parce que je vérifiais le className.
Je boucle jusqu'à TabList.length-1, parce que je veux que la dernière cellule remplisse le reste de la largeur du tableau.

Answer 1

Je vous suggère de supprimer tous les css / styling de la page et de les tester pour isoler le problème. Ce genre de choses est souvent compliqué par les CSS.

Answer 2

Si vous définissez la largeur de la table entière sur --i * MaxTabWidth. Cela répartirait-il uniformément les colonnes? Supposons que votre table s'appelle myTable.

document.getElementById('myTable').width = new String(--i*MaxTabWidth)

Modifier: ne le ferait pas non plus

for (var i = 0; i < TabList.length-1; i++)

ignorer la dernière colonne en vous arrêtant à TabList.length-2?

Answer 3

Pour ce que cela vaut, dans jQuery, cela peut être fait avec le script suivant, dans lequel votre table a l’id de "myTable". Si vous avez suffisamment de contrôle sur l'environnement pour l'ajouter dans un cadre, je le recommande vivement, car cela facilite beaucoup les tâches de ce type.

    var maxWidth = 0;

    $("#myTable td").each(function() {
        if ($(this).width() > maxWidth) {
            maxWidth = $(this).width();
        }
    });
    $("#myTable td").width(maxWidth);