Javascript 文件浏览器手风琴
我正在使用jquery制作一个文件浏览器。我想确认哪个李有一个类文件。但它也将子菜单重新定义为一个文件 我做错了什么 Jquery:Javascript 文件浏览器手风琴,javascript,jquery,html,Javascript,Jquery,Html,我正在使用jquery制作一个文件浏览器。我想确认哪个李有一个类文件。但它也将子菜单重新定义为一个文件 我做错了什么 Jquery: $(document).ready(function() { $("#accordion > li").click(function() { if (!$(this).hasClass("active")) { // Remove the cl
$(document).ready(function() {
$("#accordion > li").click(function() {
if (!$(this).hasClass("active")) {
// Remove the class from anything that is active
$("li.active").removeClass("active");
// And make this active
$(this).toggleClass("active");
/*$('li').removeClass('active');
$(this).addClass('active');*/
}
if (false == $(this).next().is(':visible')) {
$('#accordion > ul').slideUp(300);
}
if ($('li:first-child').hasClass('file')) {
console.log("Is file");
// handle as file
} else {
$(this).next().slideToggle(300);
}
});
$("#accordion > ul li").click(function() {
/*$('#accordion > ul li').removeClass('active');*/
$(this).addClass('active');
if (false == $(this).next().is(':visible')) {
$('#accordion > ul li ul').slideUp(300);
}
if ($('li:first-child').hasClass('file')) {
console.log("Is file");
} else {
$(this).next().slideToggle(300);
}
});
$('.top:even').addClass('stripe');
$('#accordion ul li:odd').addClass('stripe');
$('#accordion ul li ul li:even').addClass('stripe');
});
菜单:
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
您需要使用li:first-child属性您需要使用li:first-child属性,该属性似乎没有任何区别
<div id="menu">
<ul id="accordion">
<li class="top">
<a href="#"><img src="images/folder-icon.png" />Sports</a>
</li>
<ul>
<li>
<a href="#"><img src="images/folder-icon.png" />Golf</a>
</li>
<ul>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem 1</a>
</li>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem 2</a>
</li>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem 3</a>
</li>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem 4</a>
</li>
</ul>
<li>
<a href="#"><img src="images/folder-icon.png" />Cricket</a>
</li>
<ul>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem</a>
</li>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem</a>
</li>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem</a>
</li>
<li>
<a class="file" href="#"><img src="images/pdf-icon.png" />Menuitem</a>
</li>
</ul>
<li>
<a href="#"><img src="images/folder-icon.png" />Football</a>
</li>
</ul>
<li class="top">
<a href="#"><img src="images/pdf-folder-icon.png" />Technology</a>
</li>
<ul>
<li>
<a class="file" href="#">iPhone</a>
</li>
<li>
<a class="file" href="#">Facebook</a>
</li>
<li>
<a class="file" href="#">Twitter</a>
</li>
</ul>
<li class="top">
<a href="#"><img src="images/pdf-folder-icon.png" />Latest</a>
</li>
<ul>
<li>
<a class="file" href="#">Obama</a>
</li>
<li>
<a class="file" href="#">Iran Election</a>
</li>
<li>
<a class="file" href="#">Health Care</a>
</li>
</ul>
</ul>
</div><!--- menu --->