jquery - 我的悬停事件在 ajax 加载后不起作用，它只适用于初始页面加载

Question

我遇到了一个问题，我的悬停事件在 ajax 加载后不起作用，它只在初始页面加载时起作用。这是我目前使用的代码：

$(document).ready(function() {
  $('.like').hover(
        function () {
          var id=this.id;
          values=id.split('.');
                  id=values[0];
                  type=values[1];
          var arrow_box_id='arrow_box'+'_'+id;
          document.getElementById(arrow_box_id).style.display = "";
          jQuery.ajax({
                 url: 'fetch_likes_comment.php',
                 type: 'POST',
                 data:{ 
                     id: id, 
                     type:type
           },
           beforeSend: function() {
               },
           complete: function() { 
               }
             }).done(function( msg ) { 
                 document.getElementById(arrow_box_id).innerHTML = msg;
               });
        }, 
            function () {
           var id=this.id;
           values=id.split('.');
                   id=values[0];
                   type=values[1];
           var arrow_box_id='arrow_box'+'_'+id;
                   document.getElementById(arrow_box_id).style.display = "none";
            }
    );
});

Answer 1

做

$(document).on("mouseover",'.like',function()
{
    //stuff to do on mouseover
})."mouseout",'.like',function()
{
    //stuff to do on mouseout
});

Answer 2

.bind('event'...)触发器（.hover 是该语句的别名）仅绑定到现有元素。如果您在代码中生成新元素，它们将不受影响。

要纠正这一点，请使用新.on语句：

$('body').on( // No error, we bind the handler to the DOM body.
    'mouseover',
    '.like', // This is the selector that reacts to your handler.
    function(){ blagh; }
);

Answer 3

尝试这个：

$(document).ready(function () {
    $('body').on('hover', '.like', function () {
    // or you can also use
    //$('.like').on('hover', function () {
        var id = this.id;
        values = id.split('.');
        id = values[0];
        type = values[1];
        var arrow_box_id = 'arrow_box' + '_' + id;
        document.getElementById(arrow_box_id).style.display = "";
        jQuery.ajax({
            url : 'fetch_likes_comment.php',
            type : 'POST',
            data : {
                id : id,
                type : type
            },
            beforeSend : function () {},
            complete : function () {}

        }).done(function (msg) {
            document.getElementById(arrow_box_id).innerHTML = msg;
        });
    }, function () {
        var id = this.id;
        values = id.split('.');
        id = values[0];
        type = values[1];
        var arrow_box_id = 'arrow_box' + '_' + id;
        document.getElementById(arrow_box_id).style.display = "none";
    });
});