IE7 avec rowspan lors de la réduction dynamique de plusieurs lignes (espace supplémentaire en bas)

Question

Je tente de masquer/afficher de manière dynamique plusieurs lignes de table en utilisant JavaScript pour imiter l'effondrement/l'expansion. ici sont extraits de code pertinents:

function selectionFilter(check, filter){ 
     var elem = document.getElementById('myScrollTable').rows; 
     for(i = 0; i < elem.length; i++){ 
      var type = elem[i].getAttribute('type'); 
      if(type== filter){ 
       if(check == true){ 
        elem[i].style.display=''; 
       }else{ 
        elem[i].style.display='none'; 
       } 
      } 
     } 
    } 

et voici l'échantillon HTML:

<input type="checkbox" checked="true" value="t1" onclick="selectionFilter(this.checked, this.value);">some type 1</input > 
<input type="checkbox" value="t2" onclick="selectionFilter(this.checked, this.value);">some type 2</input ><br><br> 
<table cellspacing="1" cellpadding="2" class="" id="myScrollTable"> 
    <thead> 
     <tr> 
      <th>Data1</th> 
      <th>Data2</th> 
     </tr> 
    </thead> 

    <tbody> 
     <tr type="t1"> 
      <td rowspan="50"><a href="something1">something1</a></td><td><a href="something2">something2</a></td> 
     </tr> 
     <tr type="t1"> 
      <td><a href="something2">something2</a></td> 
     </tr> 
      . 
      . 
     <tr type="t2" style="display:none;"> 
      <td rowspan="50"><a href="something1">something1</a></td><td><a href="something2">something2</a></td> 
     </tr> 
     <tr type="t2" style="display:none;"> 
      <td><a href="something2">something2</a></td> 
     </tr> 
      . 
      . 
    </tbody> 
</table> 

Dans Firefox tout va bien. Cependant, dans IE, après la première fois qu'une ligne est cachée, quand elle n'est pas cachée, il y a de l'espace supplémentaire en bas. Cela ne se produit pas lorsque rowspan n'est pas utilisé. J'ai essayé beaucoup de choses mais je n'ai pas pu me débarrasser de l'espace supplémentaire.

Je serais vraiment reconnaissant si quelqu'un pouvait me donner un indice.

Answer 1

Avez-vous essayé d'utiliser le bloc au lieu d'une chaîne vide?

vous devriez essayer d'utiliser

elem[i].style.display = 'block'; 

et si cela échoue, vous devriez essayer

elem[i].style.display = 'table-row'; 

et AllWays vous devriez vérifier la documentation W3Schools, il est vraiment utile http://www.w3schools.com/css/pr_class_display.asp

Tellme si cette travaille pour vous