javascript - onmouseover 和 jquery 函数无法正常工作

Question

"<a " . $thumbs . " href=\"" . $url . "\" class=\"download\" rel=\"files/" . $dir . "/" . $file . "\" title=\"" . $alt . "\"   ".$hover." > </a>"

当鼠标悬停在该链接上时，将调用一个函数:

$hover = " onmouseover=\"showImageThumbnail(this, '".$url_thumb."')\"";

函数本身:

function showImageThumbnail(obj, url){          
    xOffset = 30;
    yOffset = 10;

    $.get(url, function(data) {
        $(obj).hover(function(e){

            $("body").append("<p id='screenshot'><img src='data:image/jpg;base64,"+ data +"' alt='Atsisiųsti' /></p>");                              
            $("#screenshot")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px")
            .fadeIn("fast");                        
        },
        function(){ 
            $("#screenshot").remove();
        }); 
        $(obj).mousemove(function(e){
            $("#screenshot")
            .css("top",(e.pageY - xOffset) + "px")
            .css("left",(e.pageX + yOffset) + "px");
        });
    });
}

我的问题是我的功能无法正常工作，我需要悬停两次才能使其工作。这个功能就像工具提示一样，它显示图像缩略图。我认为，我需要删除 .hover. 方法，但之后我的功能根本无法工作，或部分无法工作(例如，当光标离开链接时，缩略图不会被删除)。有人可以帮我修复该功能吗？

Answer 1

尝试进行以下更改

"<a " . $thumbs . " href=\"" . $url . "\" class=\"download\" rel=\"files/" . $dir . "/" . $file . "\" title=\"" . $alt . "\"   image=\"".$url_thumb."\" > </a>"

还有

$(function() {
    var screenshot = $("<p id='screenshot'><img src='data:image/jpg;base64,"
            + data + "' alt='Atsisiusti' /></p>").hide()
            .appendTo('body');
    var img = $('img', screenshot);

    $('.download[image]').hover(function(e) {
            $.get($(this).attr('image'), function(data) {
                img.attr('src', 'data:image/jpg;base64,'
                                + data);
            });

            img.removeAttr('src');

            screenshot.css({
                'top' : (e.pageY - xOffset) + 'px',
                'left' : (e.pageX + yOffset) + 'px'
            }).fadeIn("fast");
        }, function() {
            screenshot.hide();
    }).mousemove(function(e) {
            screenshot.css({
                'top' : (e.pageY - xOffset) + 'px',
                'left' : (e.pageX + yOffset) + 'px'
            })
    });

})