0

不明白为什么当我将鼠标悬停在图像上时我的链接不会显示。我确信这是我目前无法看到的非常简单的事情。如果有人指出我所缺少的以及可能有的任何其他提示，我将不胜感激。

$("#profile_pic").hover(
        function () {
            $(this).show($('<a id="duh" href="upload.php">Change the picture</a>'));
        }
);

我试图在悬停时显示的链接如下

<div>
    <img id= "profile_pic" src="<?php echo $picture;?>" width="164" height="164" />
</div>
4

5 回答 5

1

问题可能是<img>元素不能有内容，但您正试图将该标记附加到它。

您可以做的是将其附加到父级。

$("#profile_pic").hover(
        function () {
            $(this).closest('div').append($('<a id="duh" href="upload.php">Change the picture</a>'));
        });

现在，无论您如何执行此操作，请注意，.hover()每次鼠标移入或移出元素时，API 都会调用您的函数。每次调用都会附加另一个HTML 块。你真的想这样做吗？

相反，我建议您始终在页面上拥有该<a>标签，并让您的.hover()处理程序显示/隐藏它。

于 2012-12-06T15:19:35.767 回答
1

您不能将任何内容附加到 img，但您可以在 img 旁边插入链接。

$("#profile_pic").hover(
   function () {
    var link = $("#duh");
    link = link.length ? link : $('<a id="duh" href="upload.php">Change the picture</a>');
    $(this).after(link);
   });
于 2012-12-06T15:19:51.197 回答
0 
$("#profile_pic").hover(function () {
    $('<a id="duh" href="upload.php">Change the picture</a>').insertAfter(this);
});

I used the insertAfter as I do not have knowlege of your other structure, and appending to the parent/wrapper might not put it in close proximity to the image whereas this should. You could also use the $(this).parent() selector to append if needed.

于 2012-12-06T15:26:59.063 回答
0

你不能把 id 移到包装 div 上吗？或者给包装器它自己的类或ID？

<div id="profile_pic">
    <img src="<?php echo $picture;?>" width="164" height="164" />
</div>​

.

$("#profile_pic").hover(
    function () {
    $(this).append($('<a id="duh" href="upload.php">Change the picture</a>'));
 });​
于 2012-12-06T15:20:28.887 回答
0 
$("#profile_pic").hover(
            function () {
                $(this).after($('<a id="duh" href="upload.php">Change the picture</a>'));
});
于 2012-12-06T15:21:55.227 回答