Jquery hover không hoạt động sau khi nội dung Ajax được tải

Question

Tôi gặp sự cố khi sự kiện di chuột tôi không hoạt động sau khi tải ajax, nó chỉ hoạt động khi tải trang ban đầu ... Đây là mã tôi đang sử dụng hiện tại:

$(".table tbody tr").hover(
     function() { 
      $(this).children('td').children('.operation').children('.btn-group').fadeIn(); 
     }, 
     function() { 
      $(this).children('td').children('.operation').children('.btn-group').fadeOut(); 
     } 
    ); 

Tôi biết rằng tôi cần sử dụng $ (tài liệu) .on() làm công cụ chọn nhưng tôi không chắc cú pháp chính xác để thực hiện chức năng như trong mã gốc. Bất kỳ giúp đánh giá cao

Answer 1

SOLUTION

giải pháp của riêng Poster từ comments. Đúng, document (hoặc bất kỳ tổ tiên nào không bị ảnh hưởng bởi cuộc gọi ajax) phải được sử dụng.

$(document).on({ 
    mouseenter: function() { 
     $(this).find('.btn-group').fadeIn(); 
    }, 
    mouseleave: function() { 
     $(this).find('.btn-group').fadeOut(); 
    } 
}, '.table tbody tr'); 

ORIGINAL

$(".table tbody").on("hover","tr", 
    function() { 
     $(this).children('td').children('.operation').children('.btn-group').fadeIn(); 
    }, 
    function() { 
     $(this).children('td').children('.operation').children('.btn-group').fadeOut(); 
    } 
); 

EDIT

Đúng, hover là trường học cũ, và không hoạt động trong trường hợp này tôi đoán! Hãy thử điều này:

$(".table tbody").on({ 
    mouseenter: function() { 
     $(this).children('td').children('.operation').children('.btn-group').fadeIn(); 
    }, 
    mouseleave: function() { 
     $(this).children('td').children('.operation').children('.btn-group').fadeOut(); 
    } 
},'tr'); 

Và tôi không chắc chắn chính xác những gì bạn đang làm, nhưng điều này thậm chí có thể ngắn hơn:

$(".table tbody").on({ 
    mouseenter: function() { 
     $(this).find('.btn-group').fadeIn(); 
    }, 
    mouseleave: function() { 
     $(this).find('.btn-group').fadeOut(); 
    } 
},'tr');