html和css如何实现点击出现隐藏列表

html和css如何实现点击出现隐藏列表,第1张

需要使用到js,获取到点击按钮

声明一个变量为 var flag = false

当点击时 if(!flag){ flag = true , 把要显示的元素设置display为none}else{ flag= false, display设置为block}

<head>

<script language="javascript" type="text/javascript">

function test(){

alert("this is bt2 click")

}

</script>

</head>

<body>

<input type="button" id='bt1' onclick=" document.getElementById('bt2').click()" value="bt1">

<input type="button" id='bt2' onclick="test()" value="bt2" style="display: none">

</body>

</html>

先说说他定义的CSS吧

.hide{display:none} //隐藏

.show{display:block} //显示

//在说说SPAN里的

onClick//点击后 this.className(就是本层也就是SPAN)的className(CSS样式)为“hide”就隐藏了自己 document.getElementById('image1').className='show' (id名为'image1'的CSS样式为“show”)就是显示'image1'这个为ID的层


欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/zaji/6209993.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-18
下一篇 2023-03-18

发表评论

登录后才能评论

评论列表(0条)

保存