2个菜单JavaScript与echother

问题描述

我有2个相互冲突的JavaScript菜单。他们正在互相打开对方,例如,如果我单击一个菜单的菜单按钮,它将打开另一个菜单。这是两个菜单的javascript,所以问题是,如何使它们不互相干扰?

这是这里的新javascript,当我添加此javascript时,它开始干扰现有的javascript菜单。

这是第一个javascript的菜单

<div class="topnavmem" id="myTopnavmem">
  <a href="#">Link</a>
  <a href="#">link1</a>
  <a href="#">link2</a>
  <a href="#">link3</a> 
  <a href="#">link4</a> 
  <a href="javascript:void(0);" class="iconmem" onclick="myFunction()">
    <i class="fa fa-bars"></i>
  </a>
</div>
<script>
function myFunction() {
  var x = document.getElementById("myTopnavmem");
  if (x.className === "topnavmem") {
    x.className += " responsivemem";
  } else {
    x.className = "topnavmem";
  }
}
</script>

这是现有的javascript菜单,它是旧的菜单,然后我在上方添加了新的javascript菜单 它开始干扰此脚本,所以我该如何使每个javascript不同,我认为问题出在myfunction上?

这是第二个javascript的菜单

<div class="topnav">
  <div id="myLinks">
    <a href="#" style="background: #243144;padding: 6px 16px;">Link</a>
     <div id="topnav-subnav">       
      <a href="#">Link</a> 
      </div>
    <a href="#" style="background: #243144;padding: 6px 16px;">Link</a>
         <div id="topnav-subnav">       
      <a href="#">Link</a>   
      </div>
    <a href="#about" style="background: #243144;padding: 6px 16px;">Link</a>
         <div id="topnav-subnav">       
     <a href="#">Link</a>
      </div>
    <a href="# style="background: #243144;padding: 6px 16px;">Link</a>
         <div id="topnav-subnav">       
        <a href="#">Link</a>     
      </div>
  </div>
  <a href="javascript:void(0);" class="topnavicon" onclick="myFunction()">
    <i class="fa fa-bars"></i>
  </a>
</div>
<script type="text/javascript">
function myFunction() {
  var x = document.getElementById("myLinks");
  if (x.style.display === "block") {
    x.style.display = "none";
  } else {
    x.style.display = "block";
  }
}
</script>

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)