Javascript 首先显示列表，然后隐藏它_Javascript_Html_Css

Javascript 首先显示列表，然后隐藏它

javascript html css

Javascript 首先显示列表，然后隐藏它,javascript,html,css,Javascript,Html,Css,我使用css和JS编写代码，它们首先显示列表，然后隐藏列表。但是我做不到，有人能帮我改进吗 HTML <ul id="myDIV"> <img src="Messenger/AWTzuJu8q-E.png" onclick="myFunction()"> <li>arman</li> <li>arman</li> <li>arman</li> <li>arman

我使用css和JS编写代码，它们首先显示列表，然后隐藏列表。但是我做不到，有人能帮我改进吗

HTML

<ul id="myDIV"> 
  <img src="Messenger/AWTzuJu8q-E.png" onclick="myFunction()">
  <li>arman</li> 
  <li>arman</li> 
  <li>arman</li> 
  <li>arman</li> 
</ul>

CSS

#myDIV {width: 41px;height: 28px;overflow: hidden; }

不要使用

style.overflow

，只需使用

style.display

。此外，

必须在

if

条件中使用，以进行比较，而不是

使用

style.display=“无”而不是style.overflow=“hidden”
使用style.display=“block”而不是style.overflow=
“可见”
溢出
和显示

溢出
overflow属性指定如果内容溢出
元素的框

可见溢出未被截断。它在元素的框外渲染。这是默认值
隐藏溢出将被剪裁，其余内容将不可见

显示

块将元素显示为块元素
无元素将完全不显示（对布局没有影响）

有关更多信息，请参阅&
编辑-您以错误的方式使用了if…else
。请参阅
在你的情况下，你的功能将是这样的（请阅读我的评论）
希望这有帮助
 我不明白你想要实现什么，如果你只是想在点击时隐藏它，那么试试这个
<!DOCTYPE html>
<html>
<body>

<ul id="myDIV" onclick="myFunction()"> 
  <li>arman</li> 
  <li>arman</li> 
  <li>arman</li> 
  <li>arman</li> 
</ul>

<script>
function myFunction() {

 if(document.getElementById("myDIV").style.display= "none"){

    document.getElementById("myDIV").style.display= "visible"
}
else if(document.getElementById("myDIV").style.diaplay= "visible"){

  document.getElementById("myDIV").style.display= "none"
}}
</script>

</body>
</html>



阿曼
阿曼
阿曼
阿曼

函数myFunction（）{
if（document.getElementById（“myDIV”）.style.display=“无”）{
document.getElementById（“myDIV”）.style.display=“可见”
}
else if（document.getElementById（“myDIV”）.style.diaplay=“可见”）{
document.getElementById（“myDIV”）.style.display=“无”
}}
我不会投你反对票，因为你是新加入堆栈溢出的。但请阅读“如何提问”指南。主题：不要对新会员这么刻薄，去给某人一些爱和支持：）@Artur希望我下面的回答能帮助你。不要担心落选&欢迎来到StackOverflow！快乐编码！所以你想先展示。。然后在几秒钟后隐藏帖子/内容？喜欢5秒后隐藏…你能详细说明你的代码是如何工作的吗？你在期待什么，到底发生了什么？如果您遇到异常，请发布发生异常的行和异常详细信息。我尝试过这样做，但不起作用，我没有弄错是吗？函数myFunction（）{if（document.getElementById（“myDIV”）.style.display=“none”）{document.getElementById（“myDIV”）.style.display=“visible”}else（document.getElementById（“myDIV”）.style.display=“visible”）{document.getElementById（“myDIV”）.style.display=“hidden”}在if
语句中使用=
进行比较，而不仅仅是=
。对于显示
属性，请使用块
而不是可见
，无
而不是隐藏
@ArturGevorgian请检查上面更新的函数，并阅读注释以便更好地理解。
function myFunction() {
  if (document.getElementById("myDIV").style.display == "none") {  // If hidden, set display to block to show list
    document.getElementById("myDIV").style.display = "block";
  } else {  // If visible, set display to none to hide list
    document.getElementById("myDIV").style.display = "none";
  }
}

<!DOCTYPE html>
<html>
<body>

<ul id="myDIV" onclick="myFunction()"> 
  <li>arman</li> 
  <li>arman</li> 
  <li>arman</li> 
  <li>arman</li> 
</ul>

<script>
function myFunction() {

 if(document.getElementById("myDIV").style.display= "none"){

    document.getElementById("myDIV").style.display= "visible"
}
else if(document.getElementById("myDIV").style.diaplay= "visible"){

  document.getElementById("myDIV").style.display= "none"
}}
</script>

</body>
</html>