2016-03-01 93 views
2

我有一个问题,使用jQuery的slideToggle的jQuery的slideToggle此选择

这里是我的代码

HTML

<div class="dropdownmainmenu"> 
    <div class="hedmainmenu"> 
    <a href="#"> 
    <i class="fa fa-newspaper-o"></i> News <span class="showarrowmainmenu arrowright"></span></a></div> 
    <ul class="showmenu"> 
     <li><a href="add_news.php">Add news</a></li> 
     <li><a href="news.php">All News</a></li> 
    </ul> 
    </div> 

JS

$(".dropdownmainmenu").click(function(){ 
$(this).children(".showmenu").slideToggle(); 
$(this).toggleClass("activemainmenu"); 
$(this).find(".showarrowmainmenu").toggleClass("arrowright"); 
$(this).find(".showarrowmainmenu").toggleClass("arrowdown"); 
return false; 
}); 

我的亲瑕疵是当我滑下菜单,并尝试打开链接像添加新闻它不起作用和菜单向上滑如何我可以修复这个问题

+0

请添加的jsfiddle。 –

回答

2

如果明白你想添加EventListener只有div元素的类.hedmainmenu

//change the selector to add eventListener to the the div with class hedmainmenu 
 
$(".dropdownmainmenu > div.hedmainmenu").click(function() { 
 
    //now .showmenu is sibling of div.hedmainmenu so I used .next() 
 
    $(this).next(".showmenu").slideToggle(); 
 
    $(this).toggleClass("activemainmenu"); 
 
    $(this).find(".showarrowmainmenu").toggleClass("arrowright"); 
 
    $(this).find(".showarrowmainmenu").toggleClass("arrowdown"); 
 
    return false; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="dropdownmainmenu"> 
 
    <div class="hedmainmenu"> 
 
    <a href="#"> 
 
     <i class="fa fa-newspaper-o"></i> News <span class="showarrowmainmenu arrowright"></span> 
 
    </a> 
 
    </div> 
 
    <ul class="showmenu"> 
 
    <li><a href="add_news.php">Add news</a> 
 
    </li> 
 
    <li><a href="news.php">All News</a> 
 
    </li> 
 
    </ul> 
 
</div>