Как получить элемент нажал (для всего документа)? - PullRequest
114 голосов
/ 26 января 2012

Я хотел бы получить текущий элемент (независимо от того, какой это элемент) в документе HTML, на который я нажал. Я использую:

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

Но очень странно, я получаю текст всего (!) Документа, а не элемент, по которому щелкнули.

Как получить только тот элемент, на который я нажал?

Пример

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

Если я нажму на «тестовый» текст, я хотел бы иметь возможность прочитать атрибут с $(this).attr("myclass") в jQuery.

Ответы [ 7 ]

193 голосов
/ 26 января 2012

Вам необходимо использовать event.target, который является элементом, который первоначально вызвал событие.this в вашем примере кода означает document.

В jQuery это ...

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

Без jQuery ...

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

Кроме того, убедитесь, что вам нужно поддерживать attachEvent() вместо addEventListener().

16 голосов
/ 04 августа 2015

используйте следующее внутри тега body

<body onclick="theFunction(event)">

затем используйте в javascript следующую функцию для получения идентификатора

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

12 голосов
/ 04 июля 2017
window.onclick = e => {
    console.log(e.target);
    console.log(e.target.tagName);
} 

чтобы получить текст из нажатого элемента

window.onclick = e => {
    console.log(e.target.innerText);
} 
5 голосов
/ 26 января 2012

Вы можете найти целевой элемент в event.target:

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

Ссылки:

3 голосов
/ 26 января 2012

Используйте delegate и event.target.delegate использует всплытие событий, позволяя одному элементу прослушивать и обрабатывать события дочерних элементов.target является jQ-нормализованным свойством объекта event, представляющего объект, из которого произошло событие.

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

Демонстрация: http://jsfiddle.net/xXTbP/

0 голосов
/ 29 апреля 2017

Вот решение, в котором используется селектор jQuery, чтобы вы могли легко нацеливать теги любого класса, идентификатора, типа и т. Д.

jQuery('div').on('click', function(){
    var node = jQuery(this).get(0);
    var range = document.createRange();
    range.selectNodeContents( node );
    window.getSelection().removeAllRanges();
    window.getSelection().addRange( range );
});
0 голосов
/ 26 января 2012
$(document).click(function (e) {
    alert($(e.target).text());
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...