ti-enxame.com

Como obter o elemento clicado (para todo o documento)?

Eu gostaria de obter o elemento atual (qualquer elemento que seja) em um documento HTML que eu cliquei. Estou usando:

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

Mas, muito estranhamente, recebo o texto do documento inteiro (!), Não o elemento clicado.

Como obter apenas o elemento que eu cliquei?

Exemplo

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

Se eu clicar no texto "test", gostaria de poder ler o atributo com $(this).attr("myclass") em jQuery.

110
user1145216

Você precisa usar o event.target , que é o elemento que originalmente acionou o evento. O this no seu código de exemplo se refere a document.

Em jQuery, isso é ...

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

Sem jQuery ...

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

Além disso, verifique se você precisa dar suporte ao <IE9 para usar attachEvent() em vez de addEventListener().

190
alex

use o seguinte dentro da tag body

<body onclick="theFunction(event)">

então use em javascript a seguinte função para obter o ID

<script>
function theFunction(e)
{ alert(e.target.id);}
16
Malek Tubaisaht
window.onclick = e => {
    console.log(e.target);
    console.log(e.target.tagName);
} 

obter o texto do elemento clicado

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

Você pode encontrar o elemento de destino em event.target :

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

Referências:

5
PPvG

Use delegate e event.target . delegate aproveita a formação do evento, permitindo que um elemento ouça e manipule eventos em elementos filhos. target é a propriedade normalizada pelo jQ do objeto event que representa o objeto do qual o evento foi originado.

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

Demo: http://jsfiddle.net/xXTbP/

3
JAAulde
$(document).click(function (e) {
    alert($(e.target).text());
});
0
user1170406