You have issues like:
Duplicate ID being used. Your selector will end up having issues apart from having invalid html.
Selector incorrect .subMenue #1 should be .subMenue#1.
You can use a custom data-target attribute on li's to provide the target's selector (to avoid any string concatenation for calculating the target's id and flexibility of having any kind of selector with any nesting) instead of ids and just do $(".subMenue" + $(this).data('target')) to select the respective elements. This is kind of pattern framworks like bootstrap follows.
Try this way:
Html
Script
$(document).ready(function() {
$(".menue li").mouseover(function(){
$(".subMenue" + $(this).data('target')).css("display", "block");
}).mouseout(function(){
$(".subMenue" + $(this).data('target')).css("display", "none");
});
});
As a shortcut you can even use a one liner using .toggle()
$(document).ready(function() {
$(".menue li").hover(function(){
$(".subMenue" + $(this).data('target')).toggle();
});
});
本文讨论了在使用jQuery处理页面元素时遇到的重复ID问题,并提供了一种解决方案:通过使用自定义data-target属性来代替直接使用ID选择器,从而避免了无效的HTML结构并解决了选择器的问题。

被折叠的 条评论
为什么被折叠?



