Javascript show/hide will not hide properly in Safari

问题

It seems to be a problem with show/hide in Safari. The site looks good freshly loaded. But if you click on the first link up in the left corner and than go back, the show/hide function doesn't work so well anymore and you get layers on top of each other. Note: This problem only occours in Safari.

I've used jQuery and here is my show hide code:

    <script type="text/javascript">
  function show(id) {
    document.getElementById(id).style.visibility = "visible";
  }
  function hide(id) {
    document.getElementById(id).style.visibility = "hidden";
  }
 </script>

Link to site: http://www.smudesign2012.co.uk/

回答1:

I would suggest you use jquery to show/hide the elements.

function show(id){
    $('.student').hide(); // hide all students
    $('#'+id).show(); // show the student with applied ID
}

function hide(id){
    $('#'+id).hide(); // is this needed? Why not do the next one and skip the parameter to the function?
    $('.student').hide();
}

回答2:

try this and note the difference in .style.display

 <script type="text/javascript">
  function show(id) {
    document.getElementById(id).style.display= "";
  }
  function hide(id) {
    document.getElementById(id).style.display= "none";
  }
 </script>

来源：https://stackoverflow.com/questions/10504597/javascript-show-hide-will-not-hide-properly-in-safari