Есть какая-то кнопка, при клике на эту кнопку вызывается pop'up с инфой, которую туда же и загружаю при этом клике. Эта инфа - это чек боксы, на которые там же вешаю обработчики событий, проблема в том, что обработчик срабатывает 2 раза по непонятной причине. Других обработчиков не висит на эти кнопки, я проверял, да и в отладчике показывает что клик 2 раза срабатывает, почему? Пробовал выносить привязку обработчиков к чекбоксам в левую функцию, пробовал unbind, пробовал делать костыль, который считает кол-во кликов (но он не сработал), пробовал .one('click), но он не подошел под эту ситуацию, ведь обработчик удаляется сразу
$('.el-chat__photo--options').click(function(event) {
var chatId = $(this).parents('.el-chat').attr('data-id');
var groupsWrapper = $(this)
$('.groups-for-user-modal__list').empty();
$('.lk-groups .el-group').each(function() {
var groupName = $(this).find('.el-group__title').text();
var groupSymbol = $(this).find('.el-group__letter span').text();
var groupColor = $(this).find('.el-group__letter').css('background-color');
var groupId = $(this).attr('data-id');
var inGroup = false;
group.forEach(function(item) {
if(item.id == groupId) {
if(item.users.indexOf(+chatId) != -1) {
inGroup = true;
}
}
})
var groupItem = `
<div class="access-item" data-id='${groupId}'>
<label class="c-check">
<input type="checkbox" ${inGroup ? 'checked' : null}>
<div class="c-check__body">
<div class="c-check__box"></div>
<div class="c-check__label">
<div class="group-symbol" style="background-color: ${groupColor}"><span>${groupSymbol}</span></div>
<div class="access-name">${groupName}</div>
</div>
</div>
</label>
</div>
`
$('.groups-for-user-modal__list').append(groupItem);
})
$.magnificPopup.open({
items: {
src: '#groups-for-user',
},
type: 'inline',
});
$('.mfp-close').remove();
var magnificPopup = $.magnificPopup.instance;
console.log( $('.groups-for-user-modal__list .access-item'))
$('.groups-for-user-modal__list .access-item').each(function() {
$(this).on('click', function() {
var input = $(this).find('input[type=checkbox]').attr('checked');
console.log(input)
})
})
$('.groups-for-user-modal__content .g-btn').click(function() {
magnificPopup.close();
})
})
Вот это срабатывает 2 раза
$('.groups-for-user-modal__list .access-item').each(function() {
$(this).on('click', function() {
var input = $(this).find('input[type=checkbox]').attr('checked');
console.log(input)
})
})
В чем может быть проблема?
Простой