隐藏/显示div，最重要的是返回

Question

我想以一种特定的方式隐藏/显示div。我把一个可点击的文本放在开头，一个放在结尾。

按钮很好用，但我想要这个东西：

当用户单击底部按钮时，页面将回滚到当前隐藏div的开头

<a href="javascript:visibilite('divid21');">
<u>Examples (Click to show/hide)</u></a>

<div id="divid21" style="display:none;">

     long html code about 100 lines    

        <a onclick="    
           document.getElementById('divid21').style.display='none'; "  
           href="#divid21"> Examples  (Click to hide)</a>
</div>

函数

function visibilite(id) {
      var divs = document.getElementsByTagName('div');
 for(var no=0;no<divs.length;no++){
     if(divs[ no].className=='divs'){ 
        divs[ no].style.display = "none"; 
    }
}
document.getElementById(id).style.display = "block";  }

Answer 1

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>

用于在隐藏和显示之间切换的

Jquery

<script>
$(document).ready(function(){
    $("button").click(function(){
        $("divex").toggle();
    });
});
</script>

具有在

代码中指定的相同id的jquery Div

<button> Hide/Show </button>
<div id="divex">Div content </div>