Je souhaite sélectionner une balise d'ancrage dans une div, mais je souhaite effectuer une sélection dans la balise enfant car j'essaie de créer une liste déroulante.
Mon code HTML est comme ci-dessous:
<div>
<a href="#">Dropper 1</a>
<ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<a href="#">Dropper 2</a>
<ul>
<li>Item 4</li>
<li>Item 5</li>
<li>Item 6</li>
</ul>
</div>
Mon code JQuery est comme ci-dessous:
$(document).ready(function(){
$("ul").each(function(){
$(this).parent().click(function(){ $("ul",this).show("1000"); });
$(this).parent().mouseleave(function(){ $("ul",this).hide("1000"); });
});
})
CSS pour le code UL est comme ci-dessous:
ul {display:none;}
Maintenant, l'UL est caché et je veux sélectionner l'ancreen utilisant l'UL. La fonction ci-dessus fonctionne actuellement car elle sélectionne DIV en tant que parent et, en cliquant sur un div, ul s’affiche, mais parce que la taille de div est identique à celle de la balise anchor, toute personne cliquant sur div revient à cliquer sur son div. enfant qui est ancre et lorsque vous cliquez dessus, le comportement par défaut du navigateur est de faire défiler vers le haut à cause de href = "#". Je veux sélectionner cette ancre pour arrêter le défilement en utilisant event.preventDefault ();
Dites-moi simplement comment sélectionner cette étiquette d'ancrage en passant par UL
Réponses:
0 pour la réponse № 1je pense c'est ce que tu voulais:
$("ul").each(function() {
$(this).prev("a").click(function(e) {
e.preventDefault();
$(this).next().show("1000");
});
$(this).mouseout(function() {
$(this).hide("1000");
});
});