Как получить элемент, нажатый (для всего документа)?
Я хотел бы получить текущий элемент (любой элемент, который есть) в HTML-документе, который я нажал. Я использую:
$(document).click(function () {
alert($(this).text());
});
Но очень странно, я получаю текст целого (!) документа, а не щелкнутого элемента.
Как получить только элемент, на который я нажал?
Пример
<body>
<div class="myclass">test</div>
<p>asdfasfasf</p>
</body>
Если я нажму на "тестовый" текст, я бы хотел прочитать атрибут с $(this).attr("myclass"
) в jQuery.
Ответы
Ответ 1
Вам нужно использовать 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 || text.innerText;
}, false);
Кроме того, убедитесь, что вам нужно поддерживать < IE9, который вы используете attachEvent()
вместо addEventListener()
.
Ответ 2
используйте тег body
<body onclick="theFunction(event)">
затем используйте в javascript следующую функцию для получения идентификатора
<script>
function theFunction(e)
{ alert(e.target.id);}
Ответ 3
Вы можете найти целевой элемент в event.target
:
$(document).click(function(event) {
console.log($(event.target).text());
});
Литература:
Ответ 4
Используйте 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/
Ответ 5
window.onclick = e => {
console.log(e.target);
console.log(e.target.tagName);
}
чтобы получить текст от элемента clicked
window.onclick = e => {
console.log(e.target.innerText);
}
Ответ 6
$(document).click(function (e) {
alert($(e.target).text());
});
Ответ 7
Здесь используется решение, в котором используется селектор 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 );
});