2012-08-15 122 views
0

我有一個菜單,在該菜單中,當我們點擊它的主分區,所以它的顏色變化,當我們再次點擊時,它仍然保持相同的顏色。切換菜單選定的問題

現在我需要什麼,在這個切換菜單中,當我們點擊這個,所以它的顏色變化,但是當我們再次點擊時,它會看起來像其他父母div。

這是我的fiddle。請檢查一下。

這是我的腳本。

$(document).ready(function() { 

$(".widget2").hide(); 
$(".inner").hide(); 

function getCookie(c_name) { 
    var i, x, y, ARRcookies = document.cookie.split(";"); 
    for (i = 0; i < ARRcookies.length; i++) { 
     x = ARRcookies[i].substr(0, ARRcookies[i].indexOf("=")); 
     y = ARRcookies[i].substr(ARRcookies[i].indexOf("=") + 1); 
     x = x.replace(/^\s+|\s+$/g, ""); 
     if (x == c_name) { 
      return unescape(y); 
     } 
    } 
} 

function setCookie(c_name, value, exdays) { 
    var exdate = new Date(); 
    exdate.setDate(exdate.getDate() + exdays); 
    var c_value = escape(value) + ((exdays === null) ? "" : "; expires=" + exdate.toUTCString()); 
    document.cookie = c_name + "=" + c_value; 
} 

$(".box2").hover(

function() { 
    $(this).addClass("hover"); 
}, function() { 
    $(this).removeClass("hover"); 
}); 

var widget2 = $(".widget2"); 
var box2 = $(".box2"); 
if (getCookie('box2id') || getCookie('box1text')) { 
    var text = getCookie('box1text'); 
    var id = getCookie('box2id'); 
    $('#' + id).addClass("active"); 
    $('#' + id).next().slideDown(600, function() { 
     $('.box:contains(' + text + ')').next('.inner').slideDown(500); 
    }); 
} else { 
    $(".widget2").hide(); 
    $(".inner").hide(); 
} 

box2.click(

function() { 
    $(this).next(widget2).slideToggle(200); 
    $(".widget2").not($(this).next(widget2)).stop(true, false).slideUp();  //Hide others divs 
    var box2ID = $(this).attr('id'); 
    $(".box2").removeClass("active"); 
    $(this).removeClass("hover").addClass("active"); 
    setCookie('box2id', box2ID); 
}); 

$(".box").click(function() { 
    $(this).next(".inner").slideToggle(200); 
    var box1TX = $(this).text(); 
    setCookie('box1text', box1TX); 
}); 

});​ 

回答

0

此問題已解決。

這個例子工作正常here。請檢查我的鏈接。