javascript - 切换按钮可见性

标签 javascript html css

我正在做一个个人网站,它有点工作,但我想改进我的代码及其完成方式,所以我想做一个切换按钮,但是:

function toggle_visibility() {
  var l = document.getElementById('links');
  var p = document.getElementById('projects');

  if (l.style.display == 'inline' || p.style.display = '') {
    l.style.display = 'none';
    p.style.display = 'block';
  } else {
    l.style.display = 'inline';
    p.style.display = 'none';
  }
}
#links    { display: inline; }
#projects { display: none;   }

网站的所有代码都可以在这里找到: https://github.com/moonfz/moonfz.github.io

我还在做一个元素,CSS应该很快就会优化。 我愿意接受其他建议。

最佳答案

我认为这段代码会对你有所帮助。

function toggle_visibility() {
debugger;
  var l = document.getElementById('links');
    var d = document.getElementById('project');
    if (d.className == 'DispayButton') {
	debugger
	 d.className = "";
   l.className += "DispayButton";    
  } 
   else  {
	debugger
	 l.className = "";
   d.className += "DispayButton";    
  }    
  }
  
.DispayButton {Display:none;}

 
<html>
<head>
</head>
  <body>
<input type=button id="links" text="Switch Mode" onclick="toggle_visibility()" class="" value="links">
<input type=button id="project" text="Switch Mode" onclick="toggle_visibility()" class="DispayButton" value="project">
  </body>
  </html>
  

关于javascript - 切换按钮可见性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42067974/

相关文章:

html - 在响应式设计中导航栏覆盖菜单项

html - 防止滚动条添加到 Chrome 上的页面宽度

javascript - Knockout.js 自定义绑定(bind)设计

javascript - 为什么这个 3 维数组不起作用?

html - Bootstrap 4.5 如何更改容器网格装订线宽度

html - 在绝对定位的 div 上对齐文本 - 维恩图

css - 使元素缩小时左上/右上边框半径不变?

javascript - 如何获取代表 slickgrid 中所选行的对象

javascript - 如何使用javascript合并2个数组?

javascript - 需要有关鼠标按下所选图像的背景颜色的帮助。并删除所选其他图像的背景