通过单选钮实现页面的隐藏与显示_html/css

回复讨论(解决方案)

首页

web前端

html教程

通过单选钮实现页面的隐藏与显示_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Jun 24, 2016 pm 12:24 PM

想通过单选钮实现页面的切换，下面的内容不同，这个怎么实现

回复讨论(解决方案)

设一个单击事件，在javascript里写个函数，当单击时调用，将你所需要隐藏的div的属性设置成隐藏，剩下的不用说了吧。。。

以前用一个复选框没问题，实现了，现在用两个单选钮，实现不了

<script language="JavaScript">function show(i){var ui=document.getElementByld(i);if (i.style.display == "none") {		i.style.display = "";	}else{		i.style.display = "none";	}}	     </script>

登录后复制

以前用一个复选框没问题，实现了，现在用两个单选钮，实现不了

<script language="JavaScript">function show(i){var ui=document.getElementByld(i);if (i.style.display == "none") {		i.style.display = "";	}else{		i.style.display = "none";	}}	     </script>

登录后复制

应该一样的道理。放div 每个放你需要放的内容。然后js控制显示隐藏。

如此就可解决

<script language="JavaScript">function show(){var tc1=document.getElementById("tc01");var tc2=document.getElementById("tc02");var tc3=document.getElementById("tc03");var tc4=document.getElementById("tc04");var dd1=document.getElementById("dd01");var dd2=document.getElementById("dd02");var dd3=document.getElementById("dd03");var dd4=document.getElementById("dd04");tc1.style.display='none';tc2.style.display='none';tc3.style.display='none';tc4.style.display='none';dd1.style.display='';dd2.style.display='';dd3.style.display='';dd4.style.display='';}function taocan(){var tc1=document.getElementById("tc01");var tc2=document.getElementById("tc02");var tc3=document.getElementById("tc03");var tc4=document.getElementById("tc04");var dd1=document.getElementById("dd01");var dd2=document.getElementById("dd02");var dd3=document.getElementById("dd03");var dd4=document.getElementById("dd04");tc1.style.display='';tc2.style.display='';tc3.style.display='';tc4.style.display='';dd1.style.display='none';dd2.style.display='none';dd3.style.display='none';dd4.style.display='none';}   </script>

登录后复制

你用开关符号试试吧，
或者用按钮试试

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn