J'ai une application que je développe et j'ai besoin qu'un onclick() événement soit déclenché lorsqu'un <div> est cliqué.

En d'autres termes,

<div id="panda"></div>

 $("#panda").click(function () {
        console.log("some text");
    });

Donc, cette déclaration fonctionne, mais maintenant, disons que j'ai,

    <div id="panda">
    <lots of children>
     <div id="koala">
    </div>
    </lots of children>
    </div>


 $("#koala").click(function () {
        console.log("doesnt work");
    });

Maintenant, vous voyez pour la vie de moi, je ne peux pas faire en sorte que le koala soit cliquable. L'événement click sur les parents fonctionne bien, et click evens pour certains divs vides que j'utilise comme boutons fonctionne bien, mais pour une raison quelconque, je ne peux pas obtenir que je remplisse l'enfant <div> pour qu'il soit cliquable.

Des idées sur le cas?

J'ai essayé ça,

 $('#panda').click(function(e){
        if ($(e.target).is('#koala'))
        {
            console.log("koala");
        }

    });

Mais il enregistre simplement chaque clic sur le parent.

0
Wim 22 juil. 2015 à 15:08

3 réponses

Meilleure réponse

Une option consiste à écouter les div enfants de panda.

$("#panda").on('click','div',function() {
  console.log($(this).text()+' '+$(this).attr('id'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="panda">
    <div id="koala">
      koala
    </div>
  <div id="bear">
      bear
    </div>
</div>
0
depperm 22 juil. 2015 à 12:12

Voici un exemple,

<div id="panda">Panda
    <div id="koala">Koala</div>
</div>

$("#panda").on('click', '#koala', function () {
    alert("koala!!!");
});

Voici un violon

0
shammelburg 22 juil. 2015 à 12:20

Essayez de faire le sélecteur '#panda #koala' comme ceci

$("#panda #koala").click(function () {
        console.log("koala");
    });
0
Kemal Talen 22 juil. 2015 à 12:18