jQuery散列检测因特网浏览器

Question

我正在使用jQuery构建导航选项卡，并检测要用作参考的URL哈希值，以便在页面加载时使用哪个导航选项卡。例如，当有人转到: example.com/profile.php#media时，“media”选项卡将自动切换到。

我的jQuery代码在Safari、Firefox、Chrome和Opera中工作，但在任何版本的(经过测试的IE6-10)中都不工作。我的代码中有什么东西使它与IE不兼容吗？

JavaScript:

$(document).ready(function() {

tab = $('.tab');

function switch_active_tab() {
    tab.removeClass('active_tab');
    $(this).addClass('active_tab');
}

function hash_detect() {
    hash = document.location.hash.replace('#','');
    active_tab_id = $('.active_tab').attr('id').replace('-manager', '');
    // check if hash value is valid
    if( hash == 'pages' || hash == 'media' || hash == 'templates' || hash == 'scripts' ) {
        // if hash is not the same as the active tab
        if( hash !== active_tab_id ) {
            tab.removeClass('active_tab');
            $(document.location.hash+'-manager').addClass('active_tab');
        }
    }
    else {
        document.location = '#pages';
    }

}

function hash_respond() {
    hash = document.location.hash.replace('#','');
    active_tab_id = $('.active_tab').attr('id').replace('-manager', '');
    if( hash !== active_tab_id ) {
        document.location = '#' + active_tab_id.replace('-manager', '');
    }
}

$(document).ready(hash_detect);
$(window).bind('hashchange', hash_detect);
tab.click(switch_active_tab);
tab.click(hash_respond);

});

对应的：

<div id="tab_wrapper">
    <div class="tab active_tab" id="pages-manager">Pages</div>
    <div class="tab" id="media-manager">Media</div>
    <div class="tab" id="templates-manager">Templates</div>
    <div class="tab" id="scripts-manager">Scripts</div> 
</div>

Answer 1

根据MSDN，location对象属于window。

我看了一下我使用hash的一些代码，我只提到了location.hash，而且从来没有遇到过IE方面的问题。我怀疑您可以尝试使用window.location.hash或简单地使用location.hash。

我看到的另一个问题是，您没有用var关键字声明任何变量。(对此很感兴趣).所有变量都应该这样声明.

var hash; // simple declaration

或者..。

var hash = window.location.hash.replace('#', ''); // declaration with assignment

IE也有可能与一些完全无关的东西有问题。我会检查以确保active_tab_id得到了您期望的值。

作为最后的手段，您应该使用IE开发工具。调试器并不是全部，但有时会很有用。