单击后如何使Jquery子菜单保持可见? [英] How To Make Jquery Submenu Stay Visible After It Is Clicked?
本文介绍了单击后如何使Jquery子菜单保持可见?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我读过类似的文章,但是由于我对jquery不太满意,因此我的菜单需要更具体的帮助.
I have read similar posts but as I am not very good with jquery I need more specific help with my menu.
<div id="nav"><!--// START NAV //-->
<dl id="nav">
<dt class="nav"><b>ONE</b></dt>
<dd>
<ul>
<li><a href="/A">A</a></li>
<li><a href="/B">B</a></li>
<li><a href="/C">C</a></li>
</ul>
</dd>
<dt class="nav"><b>TWO</b></dt>
<dd>
<ul class="nav">
<li><a href="/D">D</a></li>
<li><a href="/E">E</a></li>
<li><a href="/F">F</a></li>
</ul>
</dd>
</dl>
</div><!--// END NAV //-->
这是我正在使用的JS.
Here is the JS I am using.
<script type="text/javascript">
$(document).ready(function(){
if($("#nav")) {
$("#nav dd").hide();
$("#nav dt.nav b").click(function() {
if(this.className.indexOf("clicked") != -1) {
$(this).parent().next().slideUp(200);
$(this).removeClass("clicked");
}
else {
$("#nav dt.nav b").removeClass();
$(this).addClass("clicked");
$("#nav dd:visible").slideUp(200);
$(this).parent().next().slideDown(500);
}
return false;
});
}
});
</script>
谢谢
推荐答案
菜单由于页面刷新而隐藏.您可以通过添加返回false的点击处理程序来避免这种情况.将此代码添加到您的ready
处理程序中:
The menu hides due to pagerefresh. You can avoid it, by adding click handler, that returns false. Add this code to your ready
handler:
$("#nav dd ul a").click(function(){
return false;
})
这里是示例.
更新:
您可以将选定的URL存储在cookie中.这是示例:
You can store selected url in cookies. Here is sample:
$(document).ready(function() {
if ($("#nav")) {
$("#nav dd").hide();
$("#nav dt.nav b").click(function() {
if (this.className.indexOf("clicked") != -1) {
$(this).parent().next().slideUp(200);
$(this).removeClass("clicked");
}
else {
$("#nav dt.nav b").removeClass();
$(this).addClass("clicked");
$("#nav dd:visible").slideUp(200);
$(this).parent().next().slideDown(500);
}
return false;
});
}
$("#nav dd ul a").click(function() {
$.cookie('link_href', $(this).attr('href'));
});
alert($.cookie('link_href'));
var selector = 'a[href="'+ $.cookie('link_href') +'"]';
$(selector).parents('dd').prev().find('b').click();
});
这篇关于单击后如何使Jquery子菜单保持可见?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文