boucle à travers ensemble d'éléments dans jquery

Question

$('form td .hint p') ce sélecteur jquery renvoie une liste [p,p,p,p,p,p].

Je voudrais savoir quelle est la meilleure façon de faire une boucle dans chacun d'entre eux, vérifier leurs valeurs css, et faire quelque chose si la valeur css = quelque chose que je veux.

J'ai cette fonction pour montrer et cacher une info-bulle, mais je veux seulement qu'une info-bulle soit montrée à la fois. Tout en faisant mouseover et mouseout fonctionne, c'est bogué car actuellement j'utilise parent(), next(), et child(), pour trouver le bon élément, et jquery insère instantanément un div autour de l'élément que je montre et cache . Donc, fondamentalement, j'essaye de forcer tous les autres éléments p qui ont display: block à se cacher chaque fois que mouseover se produit.

Le fait déjà:

target = $('form td .hint p'); 
target[0].css('display') gives an error. 

target.css('display') seems to only return the css of the first one. 

Answer 1

Utilisation each():

var displays = ''; 
$("p").each(function(i, val) { 
    displays += "Paragraph " + i + ": " + $(this).css("display") + "\n"; 
}); 
alert(displays); 

La raison pour laquelle cela ne fonctionne pas:

var target = $("p"); 
var display = target[0].css("display"); 

est que target[0] est pas un objet jQuery. Vous pouvez le faire:

var display = $(target[0]).css("display"); 

En outre, si vous lisez la documentation css():

Retour Une propriété de style sur le premier élément adapté .

Deux autres points méritent d'être mentionnés.

Premièrement, je ne conseillerais pas de faire une infobulle vous-même. Obtenez l'un des nombreux plugins pour cela. J'ai utilisé this one précédemment et il a fait le travail. Deuxièmement, si vous vérifiez les valeurs d'affichage CSS, il peut être utile d'utiliser un raccourci. Par exemple, vous pouvez le faire:

$("p").each(function() { 
    if ($(this).css("display") == "none") { 
    $(this).addClass("blah"); 
    } 
}); 

mais vous pouvez également utiliser les :hidden et :visible sélecteurs, donc:

$("p:hidden").addClass("blah"); 

valeurs Vérification des css() appels est très peu fiables que vous êtes seulement la vérification en ligne styles et non des valeurs de feuille de style.