jQuery的懸停功能不工作

HTMLjQuery的懸停功能不工作

<p id="para"> This is a paragraph</p>

JS/jQuery的

$("para").hover(function() {$(this).hide();}, function() {$(this).show();});

現在我想做的就是當鼠標移動到該段時元素應該隱藏，當鼠標離開元素應該再次可見。但是，該段落都沒有隱藏，因此也沒有出現。這裏有什麼問題？

來源

2012-09-26 Some Body

此外，不確定當你隱藏項目，你會得到mouseout事件，因爲該元素現在將被隱藏。 –

你缺少＃ ID選擇，剛剛「對」正在尋找一個標籤<para>（這當然不會在這種情況下存在。

$("#para")

在一個側面說明，你通常想要某種類型的div（可以說是一個尺寸的設定）等等，這樣就可以解決這種情況，並且有懸停事件發生的地方，內部div也顯示出來，使它變得不那麼「滑雪」。

另外，如果你用div做它可以用CSS完成：

div:hover #para { display:block; }

jsFiddle CSS example

來源

2012-09-26 17:42:19

ahhh不敢相信，我總是犯這個錯誤，並且由於某種未知的原因，我繼續這樣做。非常感謝您的幫助... –

你錯過了「＃」爲ID。

$("#para").hover(function() {$(this).hide();}, function() {$(this).show();});

來源

2012-09-26 17:42:54 insomiac

假設失蹤#作爲OP一個錯字..你的代碼是不會因爲需要工作..因爲鼠標移出將觸發作爲元素是隱藏的。

DEMO：http://jsfiddle.net/s8cpz/

來源

2012-09-26 17:46:19

此代碼不會有任何效果。當你徘徊在它上面時，它應該立即消失，對吧？然而，當它消失時，鼠標仍然在它上面，因此消失的p將把它註冊爲mouseleave，（它所看到的只是光標與它分離，無論光標是罪魁禍首，還是它本身，它不在乎），有效地觸發了hover的mouseleave處理程序，並且這將持續到無限期，從而導致p的快速閃爍。你可以做$("p").css({opacity',0.01})而不是$('p').hide()。檢查問題與此代碼：

<!DOCTYPE html> 
<html> 
<head> 
<script src="jquery.js"></script> 
<script> 
$(document).ready(function(){ 
setTimeout(function() { $("p").hide(); },10000); 
$("#para").mouseleave(function() {alert('cool');}); 
}); 
</script> 
</head> 
<body> 
<p id="para"> This is a paragraph</p> 

</body> 
</html>

讓您的鼠標上p，10秒，當p消失，你會看到警報坡平了，標誌着mouseleave處理器點火之後。

來源

2012-09-26 17:48:50 SexyBeast

雅它沒有按預期工作，至少我得到它的工作.. –

如果您使用（'#para'）更正（'para'），則無法獲得目標，因爲當您隱藏p標記時，立即執行mouseout事件激活並隱藏（）方法運行，並且您的p標記開始閃爍直至鼠標光標過度。 it 這個解決方案可能會有所幫助。

$("#body").hover(function(){ 
$("#para").css("visibility","hidden");}, 
      function() 
      {$("#para").css("visibility","visible"); 
      } 
      );  

<div id="body"> 
    <p id="para"> This is a paragraph</p> 
<div>

DEMO

來源

2012-09-26 17:50:04 Afshin

首先，你錯過了＃，第二，當一個元件皮，它的CSS顯示屬性更改爲無，所以它佔據頁面上沒有空間，所以鼠標是不是在它上面，它會再次出現。這創造了一種無限循環。像這樣的錯誤純粹是合乎邏輯的，有時甚至會使老版本的瀏覽器崩潰。

來源

2012-09-26 17:52:34 geekman