0

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

我的 jQuery 代码适用于 Safari、Firefox、Chrome 和 Opera,但不适用于任何版本的 Internet Explorer(已测试 IE 6 - 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);

});

对应的HTML:

<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>
4

1 回答 1

0

根据MSDN,该location对象属于window.

我查看了一些使用 IE 的代码,hash我只参考location.hash了 IE 并且从未遇到过问题。我怀疑您可以尝试使用window.location.hash或简单地使用location.hash.

我看到的另一个问题是您没有使用var关键字声明任何变量。IE 对此非常不满。所有变量都应该像这样声明......

var hash; // simple declaration

或者...

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

IE也有可能遇到完全不相关的问题。我会检查以确保active_tab_id获得您期望的价值。

作为最后的手段,您应该使用IE Developer Tools。调试器并不是全部,但有时它可能很有用。

于 2012-12-22T23:00:55.103 回答