Jquery Onclick и ссылка на объект нажали
Вопрос
У меня есть следующее выражение jQuery: внутри функции мне нужна ссылка на объект, по которому щелкнули, есть ли способ сделать это?
$('#tagList li').click(function() {
/* contents */
});
Решение
Используйте
$(this)
Другие советы
вы можете использовать возвращаемое значение
$("#tagList li").bind("click", function(e) {
alert(e.currentTarget + ' was clicked!');
});
или, если хотите, вы можете просто указать на объект в режиме jQuery
$("#tagList li").bind("click", function(e) {
alert($(this) + ' was clicked!');
});
если вы новичок в jQuery, я настоятельно рекомендую увидеть несколько скринкастов от Реми Шарп в jQuery для дизайнеров . здорово немного понять, как работает jQuery, и еще лучше, как использовать console.log () для просмотра объектов, которые вы можете использовать!
Да, ключевое слово this
ссылается на элемент DOM, по которому щелкнули. Вы можете & Quot; wrap & Quot; это так:
$(this)
Это позволит вам рассматривать его как объект jQuery.
Ключевое слово this - это то, что вы ищете. Часто вы хотите применить функцию jQuery к this , чтобы выполнить свою работу. Пример: р>
$('#tagList li').click(function() {
$(this).css({ color: 'red' });
});
Добавление нового ответа, который охватит больше вариантов использования, особенно когда вы хотите использовать функции стрелок.
Также рекомендуется не добавлять щелчок JS к элементу li. Вместо этого вы должны использовать кнопку или привязку (что-то кликабельное), вложенные в этот элемент.
Поскольку элемент, по которому вы щелкаете, может быть дочерним, вам нужно убедиться, что вы указали правильный элемент.
В моем примере я назначу щелчок для кнопки внутри li, а также для ее класса. Разметка будет просто:
<ul id="taglist">
<li><button class="tag-button">Tag 1</button></li>
<!-- ... -->
</ul>
Тогда javascript:
$('#tagList li button.tag-button').click((e) => {
const thisButton = $(e.target).hasClass('tag-button')
? $(e.target) : $(e.target).closest('.tag-button');
// do something with thisButton
});
Это гарантирует, что вы нацеливаетесь на элемент, на котором был зарегистрирован клик. Если у вас есть какая-либо вложенная разметка внутри кнопки (например, или), то цель события может быть вложенным элементом, а не элементом, которому вы хотите назначить щелчок.