如何在刷新後激活菜單選項卡

這裏是我的代碼

<head> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
    <style> 
    .menu{width: 600px; height: 25; font-size: 18px;} 
    .menu li{list-style: none; float: left; margin-right: 4px; padding: 5px;} 
    .menu li:hover, .menu li.active { 
     background-color: #f90; 
    } 
</style> 
</head> 
<body> 

<ul class="menu"> 
<li><a href='#'>One</a></li> 
     <li><a href='#'>Two</a></li> 
     <li><a href='#'>Three</a></li> 
     <li><a href='#'>Four</a></li> 
</ul> 

<script type="text/javascript"> 

var make_button_active = function() 
{ 
    //Get item siblings 
    var siblings =($(this).siblings()); 

    //Remove active class on all buttons 
    siblings.each(function (index) 
    { 
     $(this).removeClass('active'); 
    } 
) 


    //Add the clicked button class 
    $(this).addClass('active'); 
} 

//Attach events to menu 
$(document).ready(
    function() 
    { 
    $(".menu li").click(make_button_active); 
    } 
) 

</script>

誰能告訴我如何解決這個問題？

來源

2013-11-22 mahesh.posa

我刪除了'java'因爲顯然這有什麼用它做，添加了JavaScript，jQuery的... – home

正確闡述究竟想要做 – 2013-11-22 07:16:55

創建小提琴.. –

就像@Johan所說的那樣，將最後一個活動標籤存儲在localStorage或cookie中。由於兩者之間的表現沒有明顯差異。我建議你使用localStorage，因爲它更容易使用。像這樣：

function make_button_active(tab) { 
    //Get item siblings 
    var siblings = tab.siblings(); 

    //Remove active class on all buttons 
    siblings.each(function(){ 
     $(this).removeClass('active'); 
    }) 

    //Add the clicked button class 
    tab.addClass('active'); 
} 

//Attach events to menu 
$(document).ready(function(){ 

    if(localStorage){ 
     var ind = localStorage['tab']  
     make_button_active($('.menu li').eq(ind)); 
    } 

    $(".menu li").click(function() { 
     if(localStorage){ 
      localStorage['tab'] = $(this).index(); 
     } 
     make_button_active($(this)); 
    }); 

});

看看這個fiddle。

來源

2013-11-22 08:31:33

感謝您的回答馬克S，它在Mozilla中工作，但它不能在Internet Explorer中工作，如何修復它 –

我明白了，你用的是ie8嗎？然後檢查這篇文章[是否IE8開箱即可支持'localStorage']（http://stackoverflow.com/questions/3452816/does-ie8-out-of-the-box-have-support-換localStorage的）。如果它仍然不適合你，那麼我認爲你應該切換到'cookie'。有一個插件可以幫助您輕鬆設置和檢索cookie - [** jQuery.cookie **]（https://github.com/carhartl/jquery-cookie）。但我也想分享如何用javascript來做到這一點。看到這個[** jsfiddle **]（http://jsfiddle.net/mark_s/kCxnX/3/） –

如何在刷新後激活菜單選項卡

回答

相關問題