显示/隐藏jQuery脚本
问题描述:
我有show | hide脚本。它工作的很好,但我需要在我的架构显示/隐藏jQuery脚本
<!--Links-->
<div>link1</div>
<div>link2</div>
<!--Hide divs-->
<div>Show1</div>
<div>Show2</div>
修改此脚本
http://jsfiddle.net/kolxoznik1/nRf5f/
像HTML和我的目标是,HTML是这样的:
例如HTML我想要做
<div class="product_menu_categories">link_1</div>
<div class="product_menu_categories">link_2</div>
<div class="copy hide">
<ul>
<li><a href="#" id="prod_1" class="product_menu_link">test1</a></li>
<li><a href="#" id="prod_2" class="product_menu_link">test2</a></li>
</ul>
</div>
<div class="copy hide">
<ul>
<li><a href="#" id="prod_6" class="product_menu_link">test4</a></li>
</ul>
</div>
答
你是说你想要你的页面结构为:
<!-- Top Level Menus/Categories -->
<div>Menu Item #1</div>
<div>Menu Item #2</div>
<!-- Submenu Items -->
<div id="submenu-of-menu-item-1">
<div>Item A</div>
<div>Item B</div>
</div>
<div id="submenu-of-menu-item-2">
<div>Item C</div>
</div>
但仍显示正确的菜单项下的子菜单?
如果是这样,从你的jsfiddle代码更改$("div.copy:eq("+i+")").toggle().siblings("div.copy").hide();
到
$("div.copy:eq("+i+")").insertAfter(this).toggle();
$("div.copy:not(:eq("+i+"))").hide();
基本上是什么做的是移动的子菜单上的第一次点击正确的位置,然后隐藏div.copy
元素的其余部分。
以下是您在JSFiddle上修改的示例:http://jsfiddle.net/pjHu3/
您的问题是什么? – 2012-03-05 02:31:39
我有工作的jQuery脚本显示|隐藏,但我需要修改它的HTML结构,所有链接将在顶部,但在我的页面底部我将隐藏div和点击链接它显示它的div下的链接(像现在在这里:http://jsfiddle.net/kolxoznik1/nRf5f/) – Viktors 2012-03-05 02:34:51
仍然不明白你的问题。从你的HTML中,你想让'product_menu_link'链接在所有'product_menu_categories'链接下面显示(显示/隐藏)吗? – neo108 2012-03-05 02:46:19