悬停不适用于图像？

Question

我尝试下面的代码：

<script type="text/javascript">  
$(document).ready(function(){ 
    $("image").hover(
     function() { 
     $(this).append($("<span> ***</span>")); 
     }, 
     function() { 
     $(this).find("span:last").remove(); 
     } 
    ); 

    }); 

<img alt="" src="../../Content/Disp.gif" /> 

它没有工作。甚至使用$（“img”）。这是否意味着悬停不起作用的形象？

Answer 1

有这个代码的一些问题。
第一选择是不正确的：
错误

$('image') 

正确

$('img') 

其次，img元素不能包含子元素，据我知道，所以你不能使用“find”命令与它。

$(document).ready(function(){ 
    $("img").hover(
     function() { 
     $(this).append($("<span>***</span>")); 
     }, 
     function() { 
     $(this).find("span:last").remove(); // this not correct 
     } 
    ); 

    }); 

Answer 2

你可以试试这个：

$("img").each(function(){ 
    $(this).hover(function(){ 
     $(this).after("<span>Foobar</span>"); 
    }, function(){ 
     $(this).find("span:last").remove(); 
    }); 
}); 

Answer 3

你不能将一些东西附加到自闭合标签

<img src="lol.gif" alt="" /> is a self-closing tag. 
You can only append to not self closing tags like <div></div> 

Answer 4

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('img').hover(function(){ 
      $('span').html('Mouse over image'); 
     }); 
     $('img').mouseout(function(){ 
      $('span').html('Mouse not over image'); 
     }); 
    }); 
</script> 

<img alt="" src="http://stackoverflow.com/content/img/so/logo.png" /> 
<span>Mouse not over image</span> 

Answer 5

<script type="text/javascript">  
$(document).ready(function(){ 
    $("img").hover(
     function() { 
     $(this).after("<span> ***</span>"); 
     }, 
     function() { 
     $(this).next().remove(); 
     } 
    ); 
    }); 
</script> 

<img alt="" src="../../Content/Disp.gif" /> 

请务必阅读api.jquery.com，这是一个相当快读完的图书馆是一种微小的。