Всем привет. У меня есть форма с фильтрами. При изменении значений хочу вывести popover с кнопкой "Перейти" которая скрывается через 4 секунды. Проблема проявляется если изменять значения формы чаще чем в 4 секунды. Старый popover исчезает, на долю секунды появляется новый и сразу же исчезает.
Вот мой код:
function debounce(func, wait, immediate) {
var timeout;
return function() {
var context = this, args = arguments;
var later = function() {
timeout = null;
if (!immediate) func.apply(context, args);
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) func.apply(context, args);
};
};
$('.filter__entity input, .filter__entity select').on('change keypress keydown', debounce(
function(){
//$('.filter__entity').popover('hide');
$filterForm = $('*[data-role=filter-form]');
action = $filterForm.attr('action');
data = $filterForm.serialize();
console.log(data);
$(this).parents('.filter__entity').popover('destroy');
$(this).parents('.filter__entity').popover({
'content': '<a href="' + action + '?' + data + '" class="filter__submit button" style="margin: 1em;">Подобрать</a>',
'html': true,
'delay': { 'show': 300, 'hide': 100, },
}).popover('show');
// autohiding
$('.filter__entity').on('shown.bs.popover', function() {
var $pop = $(this);
setTimeout(function () {
$pop.popover('hide');
}, 4000);
});
}, 300)
);
Полагаю, что виной тому autohiding, который срабатывает для второго popover, хотя должен был сработать для первого.
Или $(this).parents('.filter__entity').popover('destroy'); отрабатывает для созданного popover...
Что я делаю не так?