Comment obtenir l'élément cliqué (pour l'ensemble du document) ?

Question

Comment obtenir l'élément cliqué (pour l'ensemble du document) ?

Demandé el 26 de Janvier, 2012: Quand la question a-t-elle été
345633 affichage: Nombre de visites la question a
5 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

J'aimerais obtenir l'élément courant (quel qu'il soit) dans un document HTML sur lequel j'ai cliqué. J'utilise :

$(document).click(function () {
    alert($(this).text());
});

Mais très étrangement, j'obtiens le texte de tout le document ( !), et non de l'élément cliqué.

Comment obtenir uniquement l'élément sur lequel j'ai cliqué ?

Exemple

<body>
    <div class="myclass">test</div>
    <p>asdfasfasf</p>
</body>

Si je clique sur le texte "test", j'aimerais pouvoir lire l'attribut avec $(this).attr("myclass" ) dans jQuery.

Demandé el 26 de Janvier, 2012 par user1145216

2 votes

La fonction de gestion s'exécute dans la portée de l'élément auquel elle est ajoutée, ici le document. Vous devrez obtenir l'élément target de l'objet événement.

Commenté el 26 de Janvier, 2012 par Bergi

Answer 1

5 Réponses

Answer 2

326voto

alex Points 186293

Vous devez utiliser le event.target qui est l'élément qui a déclenché l'événement à l'origine. L'événement this dans votre code d'exemple se réfère à document .

Dans jQuery, c'est...

$(document).click(function(event) {
    var text = $(event.target).text();
});

Sans jQuery...

document.addEventListener('click', function(e) {
    e = e || window.event;
    var target = e.target || e.srcElement,
        text = target.textContent || target.innerText;   
}, false);

Par ailleurs, si vous devez prendre en charge < IE9, assurez-vous d'utiliser attachEvent() au lieu de addEventListener() .

Répondu el 26 de Janvier, 2012 par alex (186293 Points )

1 votes

J'ai constaté que l'élément renvoyé était légèrement différent, de sorte que je n'ai pas pu le faire. if(event.target === myjQueryDivElement) Je devais le faire : if(event.target.hasClass('mydivclass')) où mydivclass est une classe que mon élément possède.

Commenté el 1 de Décembre, 2014 par Russell

0 votes

J'ai cherché un moyen de contourner Safari pendant 3 jours et je suis finalement tombé sur cet article. Vous êtes géniaux, merci.

Commenté el 8 de Janvier, 2016 par Raymond Feliciano

5 votes

@alex hey, ça devrait être || target.innerText ?

Commenté el 14 de Septembre, 2018 par Jevgeni Smirnov

Answer 3

79voto

bhv Points 323

event.target pour obtenir le element

window.onclick = e => {
    console.log(e.target);  // to get the element
    console.log(e.target.tagName);  // to get the element tag name alone
}

pour obtenir le texte de l'élément cliqué

window.onclick = e => {
    console.log(e.target.innerText);
}

Répondu el 4 de Juillet, 2017 par bhv (323 Points )

0 votes

Je suis venu ici pour le clic droit, j'ai donc essayé RightClick, mais cela n'a pas fonctionné.

Commenté el 1 de Avril, 2021 par Green

0 votes

Au lieu de onclick ajouter oncontextmenu

Commenté el 19 de Juillet, 2021 par bhv

1 votes

Pour le clic droit - au lieu de onclick ajouter oncontextmenu

Commenté el 31 de Juillet, 2021 par bhv

Afficher 2 autres commentaires

Answer 4

35voto

Malek Tubaisaht Points 165

Utiliser ce qui suit à l'intérieur de la balise body

<body onclick="theFunction(event)">

puis utiliser en javascript la fonction suivante pour obtenir l'ID

<script>
function theFunction(e)
{ alert(e.target.id);}

Répondu el 4 de Août, 2015 par Malek Tubaisaht (165 Points )

Answer 5

12voto

PPvG Points 4395

Vous pouvez trouver l'élément cible dans event.target :

$(document).click(function(event) {
    console.log($(event.target).text());
});

Références :

http://api.jquery.com/event.target/

Répondu el 26 de Janvier, 2012 par PPvG (4395 Points )

Answer 6

4voto

JAAulde Points 10235

Utilice delegate y event.target . delegate tire parti du bouillonnement d'événements en permettant à un élément d'écouter et de gérer les événements des éléments enfants. target est la propriété normalisée jQ de la event représentant l'objet à l'origine de l'événement.

$(document).delegate('*', 'click', function (event) {
    // event.target is the element
    // $(event.target).text() gets its text
});

Démonstration : http://jsfiddle.net/xXTbP/

Répondu el 26 de Janvier, 2012 par JAAulde (10235 Points )

Comment obtenir l'élément cliqué (pour l'ensemble du document) ?

Exemple

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Comment obtenir l'élément cliqué (pour l'ensemble du document) ?

Exemple

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: