Question

我有一个标签系统，用于在我的页面上的两个div之间切换。它运行良好，直到我决定使用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的操作一起使用？

Answer 1

使用jquery方法绑定事件：

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

然后自己触发哈希变换事件的即时性：

$(window).hashchange();

这样，您可以确保在加载脚本时触发了您的功能。

哈希变更事件不时有效

1 个答案: