如果列表LI具有使用jQuery的UL对我不起作用，则更改div的高度
[英]Changing height of div if list LI has UL using jquery not working for me
问题描述
I am working on a Horizontal menu which works fine for me but as per design requirement i need to change the height of <div id="nav-subMenu"></div> if main/parent menu li doesn't have any ul or submenus in other words. 
我正在使用水平菜单，该菜单对我来说很好，但是根据设计要求，如果主/父菜单li没有任何ul需要更改<div id="nav-subMenu"></div>的高度或子菜单。 jquery which i wrote is not working for me i would appreciate help in this regard. 我写的jQuery不适用于我，在此方面我将不胜感激。
Here is an example of jsFiddle 这是jsFiddle的示例
if ($('#nav-wrapper ul li').has('ul')) always return true if ($('#nav-wrapper ul li').has('ul'))始终返回true
Sample jQuery 样本jQuery
jQuery(document).ready(function () {
if ($('#nav-wrapper ul li').hasClass('active')) { //if it does have the class active
if ($('#nav-wrapper ul li').has('ul')) {
alert('aaaa');
$('#nav-subMenu').css("height", "30");
}
}
});
Sample HTML code 样本HTML代码
<div id="nav-wrapper">
<ul class="dropdown dropdown-linear" id="nav">
<li><span class="dir"><a href="#">Home</a></span></li>
<li><span class="dir"><a href="#">About Us</a></span></li>
<li><span class="dir"><a href="Articles.aspx?PageID=5&Language=en-us&ParID=0&Issue=5&CID=1">Articles</a></span></li>
<li class="active">
<span class="dir"><a href="Page.aspx?PageID=6&Language=en-us&ParID=0&Issue=5&CID=1">Categories</a></span>
<ul>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=18">Book Review</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=16">Business</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=3">Culture</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=2">Economy</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=19">Finance</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=17">Infrastructure</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=20">Lifestyle</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=21">Others</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=7">People</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=1">Politics</a></li>
<li><a href="Page.aspx?PageID=6&Language=1&ParID=6&Issue=1&CID=4">Sports</a></li>
</ul>
</li>
<li><span class="dir"><a href="News.aspx?PageID=3&Language=en-us&ParID=0&Issue=5&CID=1">News</a></span></li>
<li>
<span class="dir"><a href="Page.aspx?PageID=12&Language=en-us&ParID=0&Issue=5&CID=1">Archive</a></span>
<ul>
<li><a href="Page.aspx?PageID=1&Language=1&ParID=12&Issue=1&CID=1">106</a></li>
<li><a href="Page.aspx?PageID=3&Language=1&ParID=12&Issue=3&CID=1">102</a></li>
<li><a href="Page.aspx?PageID=4&Language=1&ParID=12&Issue=4&CID=1">103</a></li>
<li><a href="Page.aspx?PageID=5&Language=1&ParID=12&Issue=5&CID=1">109</a></li>
</ul>
</li>
<li>
<span class="dir"><a href="Multimedia.aspx?PageID=10&Language=en-us&ParID=0&Issue=5&CID=1">Multimedia</a></span>
<ul>
<li><a href="Videos.aspx?PageID=11&Language=1&ParID=10&Issue=1&CID=1">Video</a></li>
</ul>
</li>
</ul>
</div>
<div id="nav-subMenu"></div>
<div id="NewsTicker"> </div>
UPDATE: Firebug view to get idea when jquery should fire to add height to DIV 更新：Firebug视图可让jquery触发以增加DIV高度
3 个解决方案
解决方案1
1 已采纳 2013-01-08 06:07:09
I found your problem and this is working as you desired, try this out: 我发现了您的问题，并且可以按照您的要求运行，请尝试以下操作：
jQuery(document).ready(function () {
if ($("#nav-wrapper li.active").length) {
alert('yes there are .active class');
if ($(".active").has('ul').length) {
alert('yes .active class has ul');
$('#nav-subMenu').css("height", "60px");
} else {
alert("NO .active class don't have ul");
$('#nav-subMenu').css("height", "0px");
}
} else {
alert("NO .active class found.");
}
});
check this out in the fiddle here: http://jsfiddle.net/zMty8/27/ 在这里的小提琴中查看此内容： http : //jsfiddle.net/zMty8/27/
解决方案2
0 2013-01-08 05:48:36
解决方案3
0 2013-01-08 05:50:51
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.