当前位置：文江博客话题详情

仅根据菜单列表中的选择显示 div，隐藏其余部分

发布于 2024-11-29 21:59:24 字数 89 浏览 1 评论 0原文

我有一个菜单，当用户从菜单列表中选择时，它显示 div 和其余部分被隐藏我有一个巨大的菜单列表，是否有任何功能可以使其仅显示该 div 任何人都可以帮忙......

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

三生一梦 2024-12-06 21:59:24

HTML：

<ul>
   <li class="one">One</li>
   <li class="two">Two</li>
   <li class="three">Three</li>
</ul>

<div id="one"> Div one </div>
<div id="two"> Div two </div>
<div id="three"> Div three</div>

CSS：

div {
    display:none;
}

li {
    cursor:pointer;
}

JQuery：

$('li').click(function(){
    $('div#' + $(this).attr('class')).show().siblings().hide();
});

HTML:

<ul>
   <li class="one">One</li>
   <li class="two">Two</li>
   <li class="three">Three</li>
</ul>

<div id="one"> Div one </div>
<div id="two"> Div two </div>
<div id="three"> Div three</div>

CSS:

div {
    display:none;
}

li {
    cursor:pointer;
}

JQuery:

$('li').click(function(){
    $('div#' + $(this).attr('class')).show().siblings().hide();
});

回复收藏 0 原文

眼前雾蒙蒙 2024-12-06 21:59:24

这不是一个措辞特别好的问题，但我想你想给所有可以显示特定类的 div，并给每个 ond 一个 id：

<div class="revealPanel" id="panel1">
<!-- Content -->
</div>

<div class="revealPanel" id="panel2">
<!-- Content -->
</div>

<div class="revealPanel" id="panel3">
<!-- Content -->
</div>
<!-- etc. ... -->

你已经用 jquery-ajax 标记了这个查询，所以我'我假设您知道如何在页面中包含 jQuery 等。定义一个 javascript 函数来隐藏所有 div 并显示指定的 div：

function ShowPanel(panelId)
{
    jQuery('.revealPanel').hide();

    if (panelId != null)
    {
        jQuery(panelId).show();
    }
}

现在只需使用正确的 id 从每个菜单链接中调用该函数，例如：

<a href="javascript:ShowPanel('panel1');>Show Panel 1</a>

当然我可能有误解了您的问题，即使我没有，我也鼓励您在问题中提供更多细节 - 使用代码片段来展示您如何设计菜单等。

祝您好运！

This isn't a particularly well phrased question, but i'm thinking you want to give all your divs that can be shown a particular class, and give each ond an id:

<div class="revealPanel" id="panel1">
<!-- Content -->
</div>

<div class="revealPanel" id="panel2">
<!-- Content -->
</div>

<div class="revealPanel" id="panel3">
<!-- Content -->
</div>
<!-- etc. ... -->

You've tagged this query with jquery-ajax so I'm going to assume you know how to include jQuery in your page etc.. Define a javascript function to hide all divs and show a specified one:

function ShowPanel(panelId)
{
    jQuery('.revealPanel').hide();

    if (panelId != null)
    {
        jQuery(panelId).show();
    }
}

And now just call that function from each of your menu links with the correct id, for instance:

<a href="javascript:ShowPanel('panel1');>Show Panel 1</a>

Of course I may have misinterpreted your question, and even if I haven't I encourage you to provide more detail in your questions — use code snippets to show how you've designed your menu etc.

Good luck!

回复收藏 0 原文

~没有更多了~