Question

我目前正在使用CakePHP和jquery。我得到了一系列理想的结果。我必须将该数组显示为输出。其中一个数组值包含“图像ID”，它对应于数组中值的图像。我要做的是只有当我将鼠标悬停在数组数据上时才显示这些图像。现在，页面加载时会加载所有图像。这增加了页面的加载时间。使用悬停方法，只有当鼠标悬停时才会调用图像，而不会在页面加载时调用图像。

我是jquery的新手。我只是想知道如何做到这一点。如果有人告诉我某种方式开始，我可以把它拉下来。任何帮助，将不胜感激。如果您需要更多信息，请与我们联系。

此致 BG

Answer 1

尝试类似：

HTML：

<div id="showImg">Show Images</div>

Javascript和jQuery：

$('#showImg').mouseover(function(){
    $.post('pathToCakeServerPage', function(data) {
        $('#showImg').append(data);
    });
});

这里是帖子的文档 - http://api.jquery.com/jQuery.post/ 用于鼠标悬停 - http://api.jquery.com/mouseover/

Answer 2

可以使用jquery .hover（）轻松完成。

$(function() {
    $("THE CSS SELECTOR YOU WANT TO HOVER").hover(
    function () {
      $("THE CSS SELECTOR YOU WANT THE IMAGE IN").html('<img src="blabla.jpg" alt="" />');
    })

});

如果你想让blabla成为一个ID，那就给你的CSS CSS SELECTOR你想要一个id并使用jquery获得那个id

jquery - 使用悬停显示图像

2 个答案: