標籤菜單不工作在IE7,8

Question

我做了選項卡菜單，它在Chrome瀏覽器，IE 9,10中正常工作，但不能在IE 7,8中工作。 我不知道我需要更改我的代碼。

任何人都可以幫助我嗎？

http://fiddle.jshell.net/927rhwgv/

<ul class="hr_tab menu1"> 
    <li class="tab1 on" data-tab="tab-1" data-trigger-class="menu1"> 
    <a href="#">tab1</a> 
    </li> 
    <li class="tab2" data-tab="tab-2" data-trigger-class="menu2"> 
    <a href="#">tab2</a> 
    </li> 
    <li class="tab3" data-tab="tab-3" data-trigger-class="menu3"> 
    <a href="#">tab3</a> 
    </li> 
</ul> 


<div id="tab-1" class="tab_content on">111</div> 
<div id="tab-2" class="tab_content">22</div> 
<div id="tab-3" class="tab_content">33</div> 

.tab_content { display:none; } 
.tab_content.on { display:inherit;} 


$(document).ready(function(){ 
    $('ul.hr_tab li').click(function(e){ 
    var tab_id = $(this).attr('data-tab'); 
    $('ul.hr_tab li').removeClass('on'); 
    $('.tab_content').removeClass('on'); 
    $(this).addClass('on'); 
    $("#"+tab_id).addClass('on'); 
    $('.hr_tab').removeClass('menu1 menu2 menu3'); 
    $('.hr_tab').addClass($(this).attr('data-trigger-class')); 
    e.preventDefault(); 
    }); 
}) 

Answer 1

如果您havnt包括它，你可能想嘗試把這個在HTML頭：

<meta http-equiv="X-UA-Compatible" content="IE=edge"> 

應該使IE瀏覽器，如果它是最新的版本（What does <meta http-equiv="X-UA-Compatible" content="IE=edge"> do? ）