2017-06-04 2 views
1

J'ai quelques lignes dans un tableau comme le code ci-dessous et je veux après quelques secondes pour cacher le contenu de td (je les ai rempli avec le texte dans une boucle) . Mon exemple de code est cejQuery Comment cacher toute l'étendue contenant td dans un tableau

setTimeout(function() { 
    $('span').each(function(index, el) { 
     $(this).hide();//nothing happens 
    }); 
}, 5000); 


<tr> 
    <span class="myspan"><td></td></span> 
    <span class="myspan"><td></td></span> 
    <span class="myspan"><td></td></span> 
    <span class="myspan"><td></td></span> 
</tr> 

J'ai essayé d'utiliser d'autres moyens aussi, comme sauver tous les span s à un tableau, ou en sélectionnant la classe et le cacher.

var arr=$('span'); 
for (var i=0;i<arr.length;i++){ 
    arr[i].css('visibility','hidden'); 
} 

mais la même chose s'est produite. Je veux être en mesure de montrer et de cacher le contenu de td « s quand il est nécessaire, sans cacher la frontière s'il est possible

+4

Regardez votre DOM; Quel que soit le code HTML, il n'y aura pas d'éléments '' dans le DOM enveloppant les éléments ''; c'est un code HTML invalide: si vous voulez un '' dans un '

', ce '' doit être enveloppé dans '
' ou ''. –

+0

Vous ne pouvez pas avoir un élément 'span' comme noeud enfant d'un élément' tr' et un élément 'td' ne peut avoir autre chose qu'un élément' tr' comme noeud parent. –

+0

Je voulais pouvoir cacher le contenu de td et être capable de les montrer à nouveau, c'est parce que je pensais à cette méthode. J'ai essayé beaucoup de choses sans succès. Pourriez-vous suggérer quelque chose? :) –

Répondre

-1

Pour masquer tout au bout de 5 secondes, vous pouvez utiliser le code suivant

setTimeout(function() { 
$('table tr span').hide(5000); 
}, 5000); 

ou

setTimeout(function() { 
    $('table tr span').css('visibility','hidden'); 
}, 5000); 
0

Vous pouvez simplement utiliser n'importe quel élément de la balise td de la table. sinon, convertissez votre code en code valide. la sortie de votre HTML est comme ça dans le navigateur:

<body> 
    <span class="myspan"></span> 
    <span class="myspan"></span> 
    <span class="myspan"></span> 
    <span class="myspan"></span> 
    <table> 
     <tbody> 
      <tr> 
      <td></td> 
      <td></td> 
      <td></td> 
      <td></td> 
     </tr> 
     </tbody> 
    </table> 
</body> 

vous sélectionnez la durée, mais il n'y a pas plus td dans votre espace cible. Donc, votre délectation est fausse.

vous devez changer yor HTML:

<tr> 
    <td><span class="myspan"></span></td> 
    <td><span class="myspan"></span></td> 
    <td><span class="myspan"></span></td> 
    <td><span class="myspan"></span></td> 
</tr> 

vous pouvez sélectionner et faire votre fonction:

var arr=$('span'); 
arr.css('visibility','hidden'); 

ou

var arr=$('span'); 
arr.hide(); 

montrent plus tard yor il:

att.show(); 

vous n'avez pas besoin de ou aucune boucle. Il suffit de sélectionner votre cible et de dire ce que vous voulez faire. JQuery le fait pour chacun dans votre sélecteur (exactement comme une boucle)