Отключить jquery data.events от нокаутных элементов

Question

У меня есть несколько элементов div на моей странице, которые отображаются с использованием переменной knockout, чтобы контролировать, сколько divs показано на странице. Когда страница изначально отображается, я устанавливаю значение этого значения в 5 и связываю событие mouseout с каждым из div, используя плагин jquery hoverintent. Когда пользователь нажимает кнопку «Показать больше», я устанавливаю значение max div t o10 и теперь отображаются 10 элементов div, но только первые 5 имеют привязку события mouseout. Если я снова вызову вызов привязки, первые 5 элементов имеют к ним 2 события. я могу видеть количество событий с помощью

$("div.ratingbig").data('events').mouseout 

Мой вопрос заключается в том, чтобы удалить оригинальный переплет, прежде чем вновь присоединяет события. Или есть способ присоединить события только к новым элементам.

Answer 1

для удаления привязок вам нужно будет CALLL в JQuery off на элементы что-то вроде

$("div.ratingbig").off('mouseout') 

причину, по которой новые дивы не имеют событие курсора, находящегося на них в том, что они не имеют никакого знания о нем

Для этой цели вы можете использовать обработчики обработанных событий jquery. это свяжет новое событие всякий раз, когда добавляется div.

положить, содержащий элемент вокруг сгенерированных див с классом, как контейнер затем запустить что-то вроде этого на нем Event binding

$('div.container').on('mouseout','div.ratingbig',function(){}) 

это будет означать, каждый div.ratingbing внутри div.container получат обратный вызов, определенный при событие происходит.

В качестве альтернативы вы можете использовать нокаут Event Binding, чтобы связать событие с каждым из div.

Что-то вроде

<div data-bind="foreach: listOfDivs"> 
    <div class="ratingbig" data-bind="event: {mouseover: $root.someJsFunctionOnYourModel}"></div 
</div> 

первый пример в ссылке показывает, в значительной степени, как это сделать.

Answer 2

я добавил следующие инструкции, чтобы удалить существующий hoverIntent из Div элементов, если он существовал, прежде чем добавить, который будет вставлять MouseOut события

 if($(this).hoverIntent != undefined){ 
      $(this).unbind("mouseenter").unbind("mouseleave") 
      $(this).removeProp("hoverIntent_t"); 
      $(this).removeProp("hoverIntent_s"); 
     } 
     $(this).hoverIntent(configObject); 

Поэтому каждый раз перед добавлением hoverintent он будет проверять, если событие уже существует, и если он сделал это, он будет удален первым. Теперь я могу вызвать вышеописанное после изменения значения переменной нокаута, и все элементы получат hoverIntent.