Блог

В настоящее время у меня есть код, который показывает / скрывает div при наведении курсора мыши на другой div. Этот код отлично работает для начального пакета данных, к которому он применяется:

 $(document).ready(function() {
    $('.eventViewWrapper').hover( function(){
        var eventId = $(this).attr('rel');
        $("#eventActions_"   eventId).show();
   },
   function(){
      var eventId = $(this).attr('rel');
      $("#eventActions_"   eventId).hide();
   });
});
  

Однако, когда я извлекаю больше данных через ajax post, divs больше не отображаются при наведении курсора мыши.
Я понимаю, почему это происходит так, как это происходило с предыдущей функциональностью ajax, и требует реализации метода .live() . Итак, я внес следующие изменения:

 $(document).ready(function() {
   $('.eventViewWrapper').live('hover', function() {
        var eventId = $(this).attr('rel');
        $("#eventActions_"   eventId).show();
   },
   function(){
      var eventId = $(this).attr('rel');
      $("#eventActions_"   eventId).hide();
   });
});
  

Теперь это частично работает, поскольку div появляется при наведении курсора мыши. Однако, когда я отвлекаю внимание от div, он не скрывается. Я полагаю, что вторая часть кода также должна иметь метод .live (), связанный с ним, я просто не уверен, как??

Спасибо

Вы можете просто использовать события mouseenter и mouseleave , потому что это то, что .hover() используется внутри:

 $('.eventViewWrapper').live('mouseenter', function () {
    var eventId = $(this).attr('rel');
    $("#eventActions_"   eventId).show();
}).live('mouseleave', function () {
    var eventId = $(this).attr('rel');
    $("#eventActions_"   eventId).hide();
});