如果单击<li>,则隐藏内部div
您好！根据您的问题，我了解到您想了解如何在单击 <li> 标签时隐藏内部的 <div> 元素。以下是一个简单的方法，使用 JavaScript 和 CSS 来实现这个功能：
首先，在 HTML 文件中添加一个<style>` 标签，以便我们可以在其中编写 CSS 代码：
.hidden {
display: none;
}
</style>接下来，在 HTML 文件中添加 <li> 标签和 <div> 标签：
<li onclick="toggleDivVisibility()">点击我
<div id="myDiv" class="hidden">这是一个隐藏的 div 元素。</div>
</li>最后，在 HTML 文件中添加 JavaScript 代码，以便我们可以在其中编写 JavaScript 代码：
function toggleDivVisibility() {
var div = document.getElementById("myDiv");
if (div.classList.contains("hidden")) {
div.classList.remove("hidden");
} else {
div.classList.add("hidden");
}
}
</script>现在，当您单击 <li> 标签时，内部的 <div> 元素将会隐藏或显示。这个方法使用了简单的 CSS 和 JavaScript，不需要使用任何云计算品牌商。
相关·内容
4回答
如果单击某个<li>，则隐藏内部div
javascript、jquery
我的DOM看起来像这样： <div class="c1"></div><li id="li2"></<
浏览 0提问于2009-02-09得票数 1
2回答
在具有滚动的div内垂直对齐div
html、css、vertical-alignment
看看这个<div id="outer"> <ul> <li>2</li>
浏览 4提问于2014-08-22得票数 3
回答已采纳
2回答
在文档的任意位置单击时，jquery隐藏切换
jquery
我可以通过使用even.stopPropagation()在文档上的任意位置单击时隐藏下拉切换，但是如何做到这一点呢?即使我单击文档上的链接，除了隐藏切换下拉之外什么也不会发生。所以基本上我不希望发生任何事情，除非我先隐藏下拉开关。
请注意，当单击菜单时，列表会切换。当在div链接之外单击时，列表将隐藏。当我在div链接中单击时，列表会隐藏起来，并将我带到google.com。我
浏览 3提问于2015-09-01得票数 1
2回答
我试图隐藏一个隐藏在另一个<div>中的<div>。我使用了一个动画：$("#innerDiv").hide(400)，但只要外部<div>被隐藏，内部<div>就不会被隐藏，稍后当我取消隐藏外部<div>时，它是可见的。如果显示了外部<div>，则<em
浏览 2提问于2012-07-25得票数 2
3回答
如果<li>为空，则隐藏父DIV
jquery
我的HTML是：<h4>AWARDS</h4></div>
如果ul.awardsli为空，我会尝试隐藏容器div.awardsparent。下面是我的j
浏览 5提问于2012-12-12得票数 1
回答已采纳
2回答
隐藏和显示菜单子项
javascript、jquery、html、css
我目前正在使用一段jquery，当单击菜单项时，它会隐藏并显示几个div。<ul>
<li>xx</<em
浏览 2提问于2015-08-26得票数 0
2回答
无法使用jQuery显示菜单中的内容文本
javascript、jquery、html、css、menu
这个想法是，当某人单击第一个菜单时，会出现一个子菜单，然后当有人单击该子菜单时，它会消失并显示一个包含信息的div，但我无法使它正常工作。menu 2</a></li> </li><div id="show1" class="content">Lorem ipsum ad his
浏览 1提问于2015-05-12得票数 5
回答已采纳
1回答
如何通过id加载面板？
javascript、html、jquery、twitter-bootstrap
我有两个面板rpspanel和sppanel面板，如何根据所选的列表ID显示或隐藏它们？list" style="line-height: 0.01;"> { }
</li&
浏览 0提问于2020-04-29得票数 0
回答已采纳
3回答
元素(如果单击目标本身或其子元素不是使用jQuery )，则隐藏元素。
javascript、jquery、html
在使用jQuery显示和隐藏菜单时，我遇到了一些问题。我想做的是：这是我的问题所在。上面的操作非常完美，但是当您单击div内部的元素时，菜单是隐藏的，这不是我想要的结果。hide(); } else {
浏览 1提问于2014-10-12得票数 1
回答已采纳
1回答
点击jQuery表单无线电输入检测
jquery、html、forms、radio-button
我有一个具有内部部分的表单，其基本布局如下(由于它在主目录中的样式，它必须被布局--很糟糕--就像下面这样)： <ul id="q38"></li> <ul id="q39"> <li</e
浏览 2提问于2015-03-23得票数 0
回答已采纳
1回答
通过单击内部UL防止父UL崩溃
javascript、jquery
我有一个非常简单的菜单，包括折叠 <li> <ul> <li></li><li></li> <
浏览 0提问于2019-01-05得票数 1
3回答
如何使用jquery/javascript切换某些元素？
javascript、jquery、html、css
<a>标记中的每个单词都与1到3个<li>标记相关联。如果单击了相关的<a>标记，我需要执行一些操作。
<div class=&
浏览 5提问于2015-08-02得票数 1
回答已采纳
3回答
使用JS隐藏和显示div <li>元素
javascript、html、jquery、css
如果单击"1“，我希望显示"1.1、1.2、1.3”，然后单击"1.1“显示"1.1.1、1.1.2、1.1.3"，但如果单击"1.2”，则隐藏"1.1.1、1.1.2、1.1.3“并显示"1.2.1、如果我点击"2“隐藏"1.1，1.2，1.3”并隐藏"1.2.1，.“并显示"2.1，2.2“.
浏览 8提问于2021-03-06得票数 0
回答已采纳
1回答
如果在div外部单击angularjs，如何隐藏div
javascript、html、css、angularjs
对于我想要的通知，如果单击外部，div将被隐藏，html代码是
<div ng-hide
浏览 1提问于2017-08-08得票数 1
2回答
jQuery滚动事件异常
jquery、scroll
我有一个父div (id显示菜单)，其中有另一个div (类菜单)。默认情况下，菜单div是隐藏的，并在显示菜单mouseclick上上下滚动。在这里之前一切都很顺利。现在，如果单击菜单中的任何链接，我不希望菜单div向上滚动。">Link3</a></li> </div>
</d
浏览 5提问于2014-09-24得票数 0
回答已采纳
2回答
如何点击.hover()后显示的div链接
jquery
我在一个链接上悬停后显示了一个div。我想单击新div中的一个链接，并且在单击任何链接后div应该是隐藏的。你可以在 html上看到代码： <a href="#">Response Request</a> <div cla
浏览 5提问于2013-01-28得票数 0
回答已采纳
1回答
如何使子元素可见和不可见，维护正确的父子关系
jquery、html、css、parent-child
同时，“隐藏”按钮将被设置为“显示”按钮。如果用户单击“隐藏”按钮，则会发生相反的事件。我可以成功地放置一些jQuery代码。但问题是，当任何人单击“显示”按钮时，它将显示每个子元素和子元素。但是，如果用户单击"A“元素上的"Show”按钮，它只会打开A的子元素，如果他们单击A的子元素上的"Show“按钮，则只有A的子元素才会出现。</div>
浏览 2提问于2014-04-28得票数 1
回答已采纳
3回答
JQuery，当点击它的任何地方时，如何使div消失？
html、jquery
我正在努力实现以下行为：<a href="..." id="DivA">Option</a> <ul>
<li&g
浏览 3提问于2013-10-29得票数 2
回答已采纳
6回答
如何显示和隐藏div
jquery、css
当用户单击MoreDiv时，将显示HiddenDiv，再次单击或单击页面的任何位置时，必须隐藏更多hiddenDiv div.hiddenDiv { list-style:none; padding:0;} padding:2px;} .hid
浏览 0提问于2012-05-21得票数 4
回答已采纳
3回答
单击父列表时如何显示隐藏的列表项
javascript、jquery
这是标记<ul> <a href="#">Parent</a> <li>#">Grand Child</a> <
浏览 2提问于2016-07-15得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
