Question

我正在使用此脚本在我的页面上显示/隐藏菜单部分，但它似乎不适用于Internet Explorer。如何更改代码以便它也可以在IE上运行？

我认为使用切换功能可以更轻松地在Jquery中完成，但是我想保持相同的结构，任何人都可以帮助我吗？

visibleDiv1 = "";
visibleDiv2 = "";
visibleDiv3 = "";
visibleDiv4 = "";

function showHide1(elementid1){
  if (document.getElementById(elementid1).style.display == 'none'){
    document.getElementById(elementid1).style.display = '';
    if(visibleDiv1 != ""){
      if(visibleDiv1 != elementid1){
        document.getElementById(visibleDiv1).style.display = 'none';
      }
    }
    visibleDiv1 = elementid1;
  } else {
    document.getElementById(elementid1).style.display = 'none';

  }
}

function showHide2(elementid2){
  if (document.getElementById(elementid2).style.display == 'none'){
    document.getElementById(elementid2).style.display = '';
    if(visibleDiv2 != ""){
      if(visibleDiv2 != elementid2){
        document.getElementById(visibleDiv2).style.display = 'none';
      }
    }
    visibleDiv2 = elementid2;
  } else {
    document.getElementById(elementid2).style.display = 'none';
  }
}

function showHide3(elementid3){
  if (document.getElementById(elementid3).style.display == 'none'){
    document.getElementById(elementid3).style.display = '';
    if(visibleDiv3 != ""){
      if(visibleDiv3 != elementid3){
        document.getElementById(visibleDiv3).style.display = 'none';
      }
    }
visibleDiv3 = elementid3;
  } else {
    document.getElementById(elementid3).style.display = 'none';
  }
}

function showHide4(elementid4){
  if (document.getElementById(elementid4).style.display == 'none'){
    document.getElementById(elementid4).style.display = '';
    if(visibleDiv4 != ""){
      if(visibleDiv4 != elementid4){
        document.getElementById(visibleDiv4).style.display = 'none';
      }
    }
    visibleDiv4 = elementid4;
  } else {
    document.getElementById(elementid4).style.display = 'none';
  }
}

Answer 1

编码效果很差，您需要重新使用代码，只需调用要隐藏的元素即可。您已为EACH元素创建了函数。

您应该完成这样的主要功能：

function showHide(elementid, visibleDiv){
  if (document.getElementById(elementid).style.display == 'none'){
    document.getElementById(elementid).style.display = '';
    if(visibleDiv != ""){
      if(visibleDiv != elementid1){
        document.getElementById(visibleDiv).style.display = 'none';
      }
    }
    visibleDiv = elementid;
  } else {
    document.getElementById(elementid).style.display = 'none';

  }
}

以后简单地调用该函数执行类似的操作：

showHide('id-of-your-element', 'visible-div-etc');

我真的建议抓住jQuery，因为这个简单的隐藏的内容更好地支持开箱即用，你可以专注于其他事情。使用toggle()或纯.hide() / .show()个功能。

更改show-hide脚本以使其适用于IE

1 个答案: