/ / Déterminez le nombre de divs avec jQuery - jquery

Déterminer le nombre de div avec jQuery - jquery

J'utilise les outils jQuery (http://flowplayer.org/tools/index.html) pour créer des info-bulles, j’ai créé un fichier js contenant les lignes suivantes:

$("div#example-0").tooltip("#example-0-tooltip");
$("div#example-1").tooltip("#example-1-tooltip");
$("div#example-2").tooltip("#example-2-tooltip");
$("div#example-3").tooltip("#example-3-tooltip");

etc.

Cela fonctionne bien s’il ya un nombre connu d’exemples-divs, mais j’aimerais que cela fonctionne avec un nombre inconnu d’exemples-divs.

En gros, je voudrais que jQuery puisse lire l’arborescence DOM, déterminer le nombre d’exemples-divs existants, les parcourir en boucle et ajouter l’infobulle.

Quelqu'un sait-il comment faire ça?

Réponses:

8 pour la réponse № 1

Utilisez le commence avec attribuer Matcher et itérer. Récupérez l'id de l'élément actuel et appelez l'info-bulle.

$("div[id^=example-]").each( function() {
$(this).tooltip( "#" + $(this).attr("id") + "-tooltip" );
});

Ou, s'ils avaient chacun la même classe en plus d'identifiants uniques.

$("div.exampleClass").each( function() {
$(this).tooltip( "#" + $(this).attr("id") + "-tooltip" );
});

Ou si, comme @Savageman le suggère, vous pouvez vous permettre de réutiliser le même DIV pour l'info-bulle (et d'utiliser une classe pour marquer toutes les div ayant besoin d'une info-bulle).

$("div.exampleClass").tooltip("#exampleTooltip");

1 pour la réponse № 2

Donnez-leur tous la même classe pour que vous puissiez simplement faire

$("div.classname").tooltip(...);

0 pour la réponse № 3

Ceci retourne le numéro d'élément:

$("element").size();

0 pour la réponse № 4

Mettez une certaine classe à tous les divs. Le code essentiel restera le même.

Ex:

<div id="1" class="tooltip">
</div>

<div id="2" class="tooltip">
</div>
<div id="3" class="tooltip">
</div>
<div id="4" class="tooltip">
</div>

et le code:

$("div.tooltip").tooltip("#example-0-tooltip");

0 pour la réponse № 5

je ne suis pas sûr que cela aide, mais il y a une info-bulleplugin for jquery qui peut utiliser l'attribut title d'une balise pour générer une info-bulle. Il le fait automatiquement, vous n’avez donc pas besoin de définir une instruction pour chaque élément, il suffit d’attribuer un titre à la div.