一些麻煩，我絲毫jQuery的子導航代碼

Question

我有一些麻煩我絲毫jQuery的代碼，我不明白爲什麼...

我想建立一個導航白衣垂直下拉：

主要的導航已經有了一個腳本白衣這樣的作品，也同樣適用於Ajax的呼籲內容翻車的圖片

反正我試了白衣一個自寫代碼： 這是我的Jquery-Code：

function nav() { 
    $('ul li').mouseover(function() { 
     $(this).find('#submenu').show(); 
    }); 
    $('ul li').mouseleave(function() { 
     $('ul li #submenu').hide(); 
    }); 
    $('ul li #submenu').mouseleave(function() { 
     $('ul li #submenu').hide(); 
     ; 
    }); 
}; 

$(document).ready(function() { 
    nav(); 
}); 

的HTML：

<li><a href="#home"><img class="fadeim" src="themes/menu/home=1.png" data-hoverimg="themes/menu/home=2.png"/></a></li> 

    <li><a href="#lager"><img class="fadeim" src="themes/menu/lager=1.png" data-hoverimg="themes/menu/lager=2.png" /></a></li> 

    <ul class="submenu"> 
<li><a href="#">Mashable</a></li> 
<li><a href="#">CNET</a></li> 
</ul> 

    <li><a href="#anlaesseN"><img class="fadeim" src="themes/menu/anlaesse=1.png" data-hoverimg="themes/menu/anlaesse=2.png" /></a></li> 

     <ul class="submenu"> 
<li><a href="#">Mashable</a></li> 
<li><a href="#">CNET</a></li> 
</ul> 

    <li><a href="#images"><img class="fadeim" src="themes/menu/foto=1.png" data-hoverimg="themes/menu/foto=2.png" /></a></li> 

可能有人請幫我解決這個？ 謝謝

Answer 1

我想你的意思是.而不是#在$(this).find('#submenu').show();。
您還沒有ID #submenu，只有類.submenu。

更正代碼應該是：

function nav() { 
    $('ul li').mouseover(function() { 
     $(this).find('.submenu').show(); 
    }); 
    $('ul li').mouseleave(function() { 
     $('ul li .submenu').hide(); 
    }); 
    $('ul li .submenu').mouseleave(function() { 
     $('ul li .submenu').hide(); 
     ; 
    }); 
}; 

$(document).ready(function() { 
    nav(); 
}); 

編輯：檢查您的標記也，你正在尋找.submenu與.find()但ul.submenu是不是孩子李實際上是在同一個DOM級別（.siblings（ ）會在這裏工作），所以爲了得到更正確的標記，你應該在裏面嵌套ul，而不是在ul裏面嵌套ul。然後你可以使用我上面寫的代碼。就像這樣：

<li><a href="#lager">lager</a> 
    <ul class="submenu"> 
     <li><a href="http://www.mashable.com">Mashable</a> 
     </li> 
     <li><a href="http://www.cnet.com">CNET</a> 
     </li> 
    </ul> 
</li> 

Demo（你需要修復的CSS ...）