Работа с ленивыми вкладками загрузки, когда выбранная вкладка первоначально выбрана по URL-адресу #

Question

Я адаптирую сайт с несколькими тяжелыми вкладками контента, чтобы они лениво загружались, когда или когда их сначала кликнули. Чтобы сделать это, я написал следующую JQuery:

$(document).ready(function(){ 
    $("#aa,#bb,#cc,#dd,#ee").bind("click", function() { 
    target = $(this).data('target'); 
    section = $(this).data('section'); 
    if ($("#"+target).html() == "Loading") { 
     urlstring = "mysite.com/item-tab.html?item=666&tabType="+section; 
     $.ajax({ url: urlstring }).done(
      function(msg){ 
       $("#"+target).html(msg) 
      }); 
    } 
    }); 
}); 

в HTML у меня есть:

<ul class="nav nav-pills nav-justified hidden-print"> 
    <li class="first-tab active" id="aa" data-target="specContent" data-section="spec"><a href="#a" data-toggle="pill">Specification</a></li> 
    <li id="bb" data-target="vidContent" data-section="videos"><a href="#b" data-toggle="pill">Videos</a></li> 
    <!-- a bunch more like this --> 
</ul> 

<div class="tab-content"> 
    <div class="tab-pane fade active in" id="a"> 
     <h2>Product Specification</h2> 
      <div id="specContent">Loading</div> 
    </div> 

    <div class="tab-pane fade" id="b"> 
     <h2>Product Videos</h2> 
     <div id="vidContent">Loading</div> 
    </div> 
    <!-- a bunch more of these too --> 
</div> 

Теперь я врезался в стену. Обычно первый тег будет открыт при загрузке страницы, но иногда он будет вторым, сделанным через URL-адрес с #bb в конце.

Как я могу подобрать это и загрузить содержимое второй вкладки в начале? Есть ли событие, вызванное тем, что я могу проверить, когда вторая вкладка активирована через #bb в URL?

Моим другим возможным направлением было получить доступ к URL-адресу и разделить на #, чтобы извлечь bb, загрузив вторую вкладку, если бы я ее нашел, но поиск SO на этом, казалось, предположил, что я буду opening my script up to potential security risks, сделав это.

Я должен добавить, что если бы это была первая открытая вкладка в начале, я бы не включил #aa в jquery и не поместил бы настоящий контент, а не «Загрузка» в div id = «specContent "

Благодарим за любые рекомендации, предложения или указатели.

Answer 1

Ну, я отправился с разделом URL-адреса на #, поэтому я отвечаю на свой собственный вопрос здесь. Я создал новую функцию loadTab и установил для нее часть onClick, а затем вызвал ее, если в URL-адресе, указанном на моей странице, был символ «#», вызывающий атрибуты данных и атрибуты раздела данных. Кажется, работает.

function loadTab(target, section) { 
    if ($("#"+target).html() == "Loading") { 
     urlstring = "mysite.com/item-tab.html?item=666&tabType="+section; 
     $.ajax({ url: urlstring }).done(function(msg){ 
      $("#"+target).html(msg) 
     });  
    } 
} 

if(window.location.href.indexOf('#') > -1) { 
    elem = $(window.location.href.substring(window.location.href.indexOf('#'))); 
    if (elem.length) { 
     target = elem.attr('data-target'); 
     section = elem.attr('data-section'); 
     loadTab(target, section); 
    } 
} else { 
    loadTab('specContent', 'spec'); 
} 

$("#aa,#bb,#cc,#dd,#ee").bind("click", function() { 
    loadTab($(this).data('target'), $(this).data('section')); 
}); 

SO такой этикет вопрос, комментарии только пожалуйста. Есть ли проблема с отправкой вопроса, а затем его решение в течение 24 часов?