Целевой img в слайдере lightgallery.js
Есть ли способ настроить таргетинг на img, показанный в слайдере lightgallery.js?
Этот JS ниже имеет 3 неудачных попытки получить простой console.info();:
var $lg = $('#mosaic');
$lg.lightGallery({thumbnail: false, addClass: 'imgGallery'});
$('.imgGallery img').click(function() {
console.info('click'); // fail
});
$('img.lg-object.lg-image').click(function() {
console.info('click'); // fail
});
$('div.lg-img-wrap img').click(function() {
console.info('click'); // fail
});
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Элементы img, имеющие событие щелчка, не находятся внутри блока .imgGallery. На самом деле они внутри #mosaic. Если вы измените этот селектор на $('#mosaic img'), у вас все готово для этого.
Что касается двух других, эти элементы создаются динамически, поэтому они не существуют в то время, когда вы пытаетесь привязать события щелчка. Вам нужно делегирование щелчка, чтобы вы привязывали событие щелчка к внешнему элементу, но перехватывали его на дочернем элементе. Так что создайте обертку вокруг всего (или, если это невозможно, привяжите к телу)
$('body').click('img.lg-object.lg-image', function(e) {
console.info('click'); // success
console.info(this); // body (element to which the event is bound)
console.info(e.target); // img.lg-object.lg-image (element that received the click)
});
Я обновлю ответ, чтобы отразить это, но function(e) { e.target.attr('src') }
Как я могу сохранить только 'src', выбранный в переменной?
это нормально, спасибо за вашу помощь!
Мммм, хорошо, понятно, спасибо. Как мы могли получить источник изображения? var imgSrc = $ (это) .attr ('src'); не определено