Question

我尝试在另一张图片的鼠标悬停上显示图片。我正在使用dijit / Tooltip。问题是，图像没有在第一次鼠标悬停时显示，它总是在第二次以后出现。动态显示图像并给出动态ID。

<c:forEach items="${model.images}" var="image" varStatus="status">
    <img  src="${image.url}" height="50" onmouseover="showImage('${image.id}')" id="image${image.id}" /> 
<c:forEach>

<script>
    function showImage(name) {
        require(["dijit/Tooltip", "dojo/domReady!"], function(Tooltip){
            new Tooltip({
                connectId: ["image"+name],
                label: "<img src='/images/"+name+"'/>"
            });
        });
    };
</script>

Answer 1

使用dijit / Tooltip不需要onmouseover功能。使用您的代码，第一个鼠标悬停仅设置工具提示。第二次附加Tooltip并显示它（并且showImage（）再次运行，这不是最佳的）。将图像添加到dom时，需要创建工具提示。有关如何以声明方式设置工具提示的示例，请参阅dijit/Tooltip guide。或者，您可以转换代码以编程方式添加图像及其工具提示。

使用dojo将图像作为工具提示

1 个答案: