0

メニューが 1 つあります。そのメニューでは、メイン div をクリックすると色が変わり、もう一度クリックすると同じ色のままになります。

今私が必要としているのは、このトグル メニューで、これをクリックすると色が変わりますが、もう一度クリックすると、他の親の div のように見えます。

ここに私のフィドルがあります。これをチェックしてください。

これが私のスクリプトです。

$(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);
});

});​
4

1 に答える 1

0

この問題は解決されました。

この例はここで正常に機能しています。私のリンクを確認してください。

于 2012-08-25T07:10:50.063 に答える