2

嗨，我有一个 img，当我将鼠标悬停在它上面时，我希望它取消隐藏 div，但是它不起作用。这是我的尝试。

     $("img").hover(
          function () {
          var currentID = $(this).attr('id');
          $('.'+currentID).show();
      },
          function () {
          var currentID = $(this).attr('id');
          $('.'+currentID).hide();
      }
     );

这是HTML

     //intially hidden via display:none

     <div class="Alligator sinensis" style="display:none;border:solid;float:right;">

     //this is the image       
     <img id="Alligator sinensis" class="circular resultss imgs" src="http://media.eol.org/content/2013/02/20/13/27869_orig.jpg">
4

3 回答 3

3

您的 ID 和班级不能有空格。

<div class="AlligatorSinensis" style="display:none;border:solid;float:right;">

 //this is the image       
<img id="AlligatorSinensis" class="circular resultss imgs" src="http://media.eol.org/content/2013/02/20/13/27869_orig.jpg">
于 2013-08-10T07:26:03.680 回答
1

尝试删除 id 和 class 中的空格。该类实际上是2类：鳄鱼+中华

于 2013-08-10T07:26:10.080 回答
0

好吧，除了标记问题之外，我认为您不能将 img 悬停在 div 内display:none;。所以你需要为它创建一个父 div。

关于 Class/Id，你不能有一个带有空格的 ID，它以带有空格的 Class 为目标，在类中它意味着 2 个不同的类。所以要么删除空间（就像我做的那样，或者_像这样使用：Alligator_sinensis

在这里检查

我建议这样做：

$("#outerdiv").hover(function () {
    var currentID = $(this).find('img').attr('id');
    console.log(currentID);
    $('.' + currentID).show();
},

function () {
    var currentID = $(this).find('img').attr('id');
    $('.' + currentID).hide();
});

和html：

<div id="outerdiv">//intially hidden via display:none
    <div class="Alligatorsinensis" style="display:none;border:solid;float:right;">//this is the image
        <img id="Alligatorsinensis" class="circular resultss imgs" src="http://media.eol.org/content/2013/02/20/13/27869_orig.jpg" />
    </div>
</div>
于 2013-08-10T07:32:17.050 回答