我试图在单击切换项目时保持下拉菜单保持打开状态。我成功地保持下拉菜单打开,但我切换的项目不能正常工作。我第一次单击切换项时,它会执行它应该执行的操作,但第二次单击它时,它不会切换,直到我关闭下拉菜单。谁能给我一些指示?
HTML:
<div class="span2">
<div class="dropdown sort_main">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Sort by: </a>
<span>Rating</span>
<ul class="dropdown-menu sort" role="menu" aria-labelledby="dLabel">
<li><a id="ratings" href="#">Option1</a></li>
<li><a id="timezone" href="#">>Option2</a></li>
<li><a id="level" href="#">>Option3</a></li>
</ul>
</div>
</div>
<script>
$("a#ratings").click(function(){
$(this).toggleClass("option_selected"); //it will not remove this class until i close menu and open it again
});
$('.dropdown-menu a#ratings').click(function(e) {
e.stopPropagation();
});
</script>