2015-02-07 3 views
0

У меня есть система табуляции, которая предназначена для переключения между двумя div s на моей странице. Он работал хорошо, пока я решил заставить его работать с URL (точнее, реагировать, когда происходит событие onhashchange). Он работает время от времени. Я не знаю, где проблема в этом крошечном фрагменте кода, и он погружает меня в сумасшествие.Время смены события хеширования

$(function() { 
    if ("onhashchange" in window) { 
     console.log("onhashchanged is supported"); 
    } else { 
     console.log("onhashchanged is not supported") 
    } 
    window.onhashchange = function() { 
     var hash = (window.location.hash.substr(1) != "") ? window.location.hash.substr(1) : "articles"; 

     var tabId = hash + "t"; 
     var tabBtnId = hash + "tb"; 

     $("div.tabbar > div.tabbarButton").removeClass("current"); 
     $("div.tabbar > div.tabbarButton#" + tabBtnId).addClass("current"); 

     var $tabs = $(".tabsContent"); 
     $tabs.find(".tab").removeClass("current"); 
     $tabs.find(".tab#" + tabId).addClass("current"); 
    }; 

    $("div.tabbar > div.tabbarButton").click(function() { 
     var selectedTabId = $(this).prop("id"); 
     var hashVal = "#" + selectedTabId.substr(0, selectedTabId.length - 2); 
     window.location.assign(hashVal); 
     console.log(hashVal); 
    }); 
    }); 

Мое предположение: Я полагаю, что hashchange событие происходит до того, как DOM готова и функция не вызывается в моем коде (так как он находится в $(function(){ /*...*/ })), но если это является причиной, то где я могу поместить обработчик события так, чтобы он работал с операциями jQuery?

ответ

0

Используйте Jquery способ связать событие:

$(window).hashchange(function(){ /* ... */ }); 

А потом immedialty AFER, что триггером событие hashchange сами:

$(window).hashchange(); 

Таким образом, вы можете быть уверены, что ваша функция срабатывает, когда сценарий загружен.

Смежные вопросы