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);
});

他の構造についての知識がないため、insertAfterを使用しました。親/ラッパーに追加すると、画像の近くに配置されない可能性がありますが、これは必要です。$(this).parent()必要に応じて、セレクターを使用して追加することもできます。

于 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 に答える