Открыть конкретный div с определенной ссылкой

Question

Я отформатировал свой сайт, где ссылки открываются из разных div, а не разных страниц.

Что-то вроде:

<li><a id="search-reg-options" data-display="#search-adds" 
        class="side-a-li">SEX OFFENDER SEARCH</a> 
        <div id="search-adds" class="sub-options"> 
         <ul> 
          <li><a data-display="#mapdiv" class="side-a-option">SEARCH 
            SEX OFFENDER REGISTRIES</a></li> 
          <li><a class="side-a-option">SEX OFFENDER MANAGEMENT 
            PROGRAM SUCCESS</a></li> 
          <li><a class="side-a-option">SEX OFFENDER MANAGEMENT 
            PROGRAM SUCCESS</a></li> 
         </ul> 
        </div></li> 

    $(document).ready(function(e) { 
     $('a').not($('#search-reg-options')).click(function(e) { 
      $('.ui-show').removeClass('ui-show') 
      var mydiv = $(this).data('display'); 
      $(mydiv).addClass('ui-show'); 
     }); 

     $('#search-reg-options').click(function(e) { 
      $('.options-shown').removeClass('options-shown') 
      var mydiv = $(this).data('display'); 
      $(mydiv).addClass('options-shown'); 
     }); 
    }); 

Так что нажав на ссылку откроется DIV мой меняющийся дисплей. Проблема в том, что я не знаю, как связать пользователя с конкретным div, чтобы при щелчке по ссылке div уже был показан.

Возможно, некоторые javascript или что-то могут это исправить? Я скорее не перестраиваю свой проект, так что каждая страница представляет собой другой файл jsp.

Чтобы уточнить,

Я хочу локальный: 8080/Frontpage/# div1 открыть Div1 когда грузы сайт ...

Это веб-приложение имеет пружинный MVC позвоночник, так что если что-то может также исправить. Это тоже будет хорошо.

Answer 1

Вы можете использовать access.hash, если он существует, тогда запустите код так же, как если бы кто-то нажал на якоря.

Свойство hash задает или возвращает опорную часть URL-адреса, включая знак hash (#).

$(document).ready(function(){ 

    if (location.hash.length != 0) { 
     $('.ui-show').removeClass('ui-show') 
     var mydiv = location.hash; 
     $(mydiv).addClass('ui-show'); 
    } 

}); 

Answer 2

$(function(){ 
 
\t \t $('a').click(function(){ 
 
\t \t 
 
\t \t \t var tooglediv=$(this).attr('data-toggle'); 
 
\t \t \t 
 
\t \t $(tooglediv).toggleClass('active'); 
 
\t \t }); 
 
\t 
 
\t }); 
 
\t

  .toggle { 
 
       width:50px; 
 
    \t \t \t height:0; 
 
    \t \t \t display:none; 
 
       background:#333; 
 
    \t \t } 
 
    \t \t .toggle.active { 
 
    \t \t  height:50px; 
 
    \t \t  display:block; 
 
    \t \t }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<a href="#" data-toggle="#toggle">click</a> 
 
    <div class="toggle" id="toggle"></div>