jQuery選擇問題（我認爲）

我有以下jQuery選擇問題（我認爲）

<script type="text/javascript"> 
    $(document).ready(function() { 
     var ChildMenusFound = $(".menu_Child").hover(function() { 
      //Mouse Over 
          alert('ok'); 
      $(this).toggleClass("menu_hover"); 
     }, function() { 
      //Mouse Out 
          alert('ok'); 
      $(this).toggleClass("menu_hover"); 
     }); 
    }); 
</Script>

劇本我輸出HTML如下：

後調用懸停（），ChildMenusFound包含2個元素，Firefox顯示沒有JS錯誤，但鼠標懸停在li元素之外不會導致任何事情發生。

有人能找出我的錯誤嗎？

來源

2010-10-18 Basic

什麼是無功ChildMenusFound呢？ – woodscreative 2010-10-18 19:13:54

僅用於調試目的 - 在調用hover（）之後，我提醒ChildMenusFound.length，以便可以看到選擇器找到了多少個元素。 – Basic 2010-10-18 22:07:08

您的標記已損壞。你在標籤外面有引號。它也看起來像你錯過了</li>某個地方的第一個外部</li>，但很難說。

來源

2010-10-18 19:09:27 Pointy

該死的 - 謝謝。我花了很長時間盯着JQuery，我得到了隧道視覺。 – Basic 2010-10-18 19:13:39

你的HTML是有點過了，你有這樣的類未關閉（或錯誤地關閉）：

<li class="menu_Child>" 
        ^here

它應該是：

<li class="menu_Child">

Here's the fixed/working version，你可以瘦你的代碼雖然下降，像這樣：

$(function() { 
    $(".menu_Child").hover(function() { 
    $(this).toggleClass("menu_hover"); 
    }); 
});

有了一個回調傳遞給.hover()它的CAL無論是進出方向，並且由於您正在切換，您可以在此保存代碼。

來源

2010-10-18 19:10:21

我確實修正了這個ug，並且沒有注意到它（CTRL-Z）。感謝您發現它 – Basic 2010-10-18 19:14:10

其他回答指出你的HTML標記損壞。

要考慮的一件事可能是使用CSS代替javascript來做你的hover。它不會在IE6中工作，除非它位於<a>元素上，但它將在大多數其他瀏覽器中使用。

.menu_Child { 
    background: yellow; 
} 

.menu_Child:hover { 
    background: orange; 
}

不知道效果是什麼，你要去的，但如果你能懸停元素更改爲<a>，它將在IE6正常工作。

來源

2010-10-18 19:13:38 user113716

一個好主意和一個我通常會選擇的應用 - 然而，在這種情況下，這是菜單系統的開始，以及切換課程，我要滑動/菜單。由於如果JS不存在，我只能回到CSS菜單，所以我會在那裏使用懸停方式。無論如何，JQuery菜單需要JS，所以這是一個方便，沒有實際成本。 – Basic 2010-10-18 22:09:26

要小心，你已經倒兩個字：

<li class="menu_Child>"

需要成爲

<li class="menu_Child">

來源

2010-10-18 19:21:45

jQuery選擇問題（我認爲）

回答

相關問題