기존 클래스 이름을 제거하고 jQuery 및 쿠키가있는 새 클래스 이름을 추가하려면 어떻게해야합니까?

StackOverflow https://stackoverflow.com/questions/804584

문제

클래스 이름을 제거하고 새 이름으로 교체 할 수 있습니까?

<style>
    .red {background-color: #FF0000;}
    .green{background-color: #00FF00;}
    .blue {background-color: #0000FF;}
</style>

<body class="red">
    <ul>
        <li><a href="">red</a></li>
        <li><a href="">green</a></li>
        <li><a href="">blue</a></li>
    </ul>
</body>

이 경우 빨간색 또는 녹색 또는 파란색을 클릭하면 바디 클래스 이름이 그에 따라 변경됩니다. 또한 선택을 절약 할 수있는 쿠키를 만들 것입니다.

jQuery .addClass를 시도했지만 작동 중이지만 기존 클래스 위에 클래스를 추가하고 있습니다. 또한 쿠키를 저장할 수 없습니다.

도움이 되었습니까?

해결책

사용:

$('.red').removeClass('red').addClass('blue');

다음은 전체 작업 코드입니다:

$(function() {
    $("a").click(function() {
        var color = $(this).text();
        $("body").removeClass().addClass(color);
        return false;
    });
});

그리고 이제 쿠키 부분을 위해

$(function() {
    $("a").click(function() {
        var color = $(this).text();
        $("body").removeClass().addClass(color);
        createCookie("color",color);
        return false;
    });

    if (readCookie("color") != null) {
      $("body").removeClass().addClass(readCookie("color"));

    }
    else {
      $("body").removeClass().addClass("red");
    }
});

function createCookie(name,value,days) {
    if (days) {
        var date = new Date();
        date.setTime(date.getTime()+(days*24*60*60*1000));
        var expires = "; expires="+date.toGMTString();
    }
    else
        var expires = "";
        document.cookie = name+"="+value+expires+"; path=/";
    }

    function readCookie(name) {
        var nameEQ = name + "=";
        var ca = document.cookie.split(';');
        for (var i=0;i < ca.length;i++) {
            var c = ca[i];
            while (c.charAt(0)==' ')
                c = c.substring(1,c.length);
            if (c.indexOf(nameEQ) == 0)
                return c.substring(nameEQ.length,c.length);
        }
        return null;
    }

    function eraseCookie(name) {
    createCookie(name,"",-1);
}

여기서 작업 예제. 감사합니다 퀴크 스 모드 사전 제작 된 쿠키 코드 (쿠키 커터 쿠키 코드?)

다른 팁

jQuery가 없으면 다음과 같은 단순한 선 으로이 작업을 수행 할 수 있습니다.

document.getElementsByTagName("body")[0].className = "red";

이렇게하면 요소에 할당 된 클래스를 효과적으로 제거하고 원하는대로 교체합니다.

쿠키의 경우 PPK에는 쿠키를 읽고 쓰기/쓰기/지우는 몇 가지 간단한 방법이 있습니다..

createCookie("mySiteCookie", "red", 7); // Set the cookie to expire in 7 days.
readCookie("mySiteCookie"); // Should yield "red"

당신은 또한 필요합니다 removeclass.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top