jQuery 저장 "this"를 사용하는 토글 된 목록의 쿠키

Question

나는이 사이트의 게시물에서 함께 연결된 토글 목록 디스플레이를 사용하고 있습니다. 그들은 잘 작동하지만 쿠키 값을 저장할 수 있기를 원했습니다.

"if (myCookie == value) {.myClass"...} "와 같은 단일 클래스/항목을 타겟팅 할 때 쿠키 작업을 수행하는 방법을 알아 냈습니다. 그러나 문제는 "$ (this)"를 사용하여 영향을받는 일련의 목록을 사용하고 있다는 것입니다. 클래스 값을 통해 타겟팅하면 해당 클래스를 사용하는 모든 것을 타겟팅하므로 작동하지 않습니다. 이해가 되니? 쿠키는 "myClass"가 아닌 "this"에 영향을 주어야합니다.

다음은 필자가 작성한 코드입니다.

// append links to the element directly preceding the element with a class of "toggle" 
$(".toggle").prev(".toggleList").append('<a href="#" class="toggleLink" id="collapse"></a>'); 

// hide all of the elements with a class of 'toggle' 
$('.toggle').show(); 

$('a.toggleLink').click(function() { 

    // change the link depending on whether the element is shown or hidden 
    if (!$(this).is('.active')) { 
     $(this).addClass('active'); 
     $(this).attr("id" ,"expand"); 
        THIS IS WHERE I NEED THE $.COOKIE TO WORK. I NEED IT TO REMEMBER THAT "THIS" IS "EXPANDED" OR THAT THE FOLLOWING LINE IS "COLLAPSED" 
    } 
    else { 
     $(this).removeClass('active'); 
     $(this).attr("id" ,"collapse"); 
    } 

    // toggle the display 
    $(this).parent().next('.toggle').toggle(); 
    return false; 
}); 

그냥 나는 우리가 우리의 테스트 사이트의 다른 곳에서 사용했던 쿠키의 기본적인 사용법에 대한 이해를해야합니까 ... 여기에 추가 할 수 있습니다. 문제는

// cookies 
// sidebar state 
var sideBar = $.cookie('sideBar'); 

// Set the user's selection for the left column 
if (sideBar == 'collapsed') { 
    $('#btnCollapseSidebar').css("visibility" ,"hidden"); 
    $('#btnExpandSidebar').css("visibility" ,"visible"); 
    $('#leftCol').css("visibility" ,"hidden");  
    $('#sidebar').css("visibility" ,"hidden"); 
    $('#rightCol').css("margin" ,"42px 0 0 45px"); 
}; 

나는 하나의 클래스를 타겟팅 할 수 없습니다 위에 나열된으로 사용할 필요가있는 방법 그러나 실제 항목 ... 내가 그들을 사용하는 방법을 알고있는 유일한 방법은 그들이 다음과 같습니다처럼 그들을 대상이라는 것이다 ("이"). 위의 코드를 적용하여 적용을 시도하면 내 ".toggle"클래스의 모든 인스턴스에 영향을줍니다. ".toggle"클래스는 페이지에서 여러 번 사용되며 무한 횟수 사용할 수 있어야합니다.

Answer 1

jQuery 사용 쿠키 플러그인은 구현하기가 매우 쉽습니다.

var CookieOptions = { expires: 7, path: '/' } 
$.cookie("CookieName", "CookieValue", CookieOptions); 

http://www.electrictoolbox.com/jquery-cookies/이 수행하여 쿠키를 가져 오기 : 입력에 대한

$.cookie("CookieName");