나는 에 대한 클릭 기능이있는 https://github.com/carhartl/jquery-cookie의 기능을 가지고 있으며 배열로 각각 data-hook
을 저장하고이를 쿠키로 저장 한 다음 div는 /itin/your-itin/
페이지에서 볼 수 있습니다. 다음은 설정 한 데모입니다. http://nealfletcher.co.uk/itin/.grid-block
div를 클릭하면 여행 일정에 추가되고 http://nealfletcher.co.uk/itin/your-itin/으로 이동하면 해당 div 만 볼 수 있으며 x 시간 동안 쿠키로 저장됩니다. 위의 코드는 훌륭하게 작동하지만 더 많은 div를 추가하기 위해 돌아 가면 쿠키가 저장되지만 이전의 것들은 지워지고 배열에 계속 추가하고 쿠키로 저장 한 다음 탐색 할 때 다음과 같이됩니다. http://nealfletcher.co.uk/itin/your-itin/ 별도로 추가 한 경우에도 모든 선택 사항이 표시됩니다. 그 말이 맞는다면?
jQuery를이 :jQuery : 배열에 추가 클릭하여 쿠키로 저장
$(window).load(function() {
var cfilter = [];
var $container = $('.block-wrap');
$container.imagesLoaded(function() {
$container.isotope({
itemSelector: '.grid-block',
animationEngine: 'best-available',
filter: '.grid-block',
masonry: {
columnWidth: 151
}
});
$(".grid-block").click(function() {
var thing = $(this).attr("data-hook");
var test = "." + thing;
cfilter.push(test);
$.removeCookie('listfilter', {
path: '/itin/your-itin/'
});
// We need to set the cookie only once
// it stays at the url for 7 days
$.cookie("listfilter", cfilter, {
expires: 365,
path: '/itin/your-itin/'
});
});
if ($.cookie("listfilter") !== 'null') {
// console log just for testing
console.log($.cookie());
$('.block-wrap').isotope({
filter: $.cookie("listfilter")
});
return false;
} else {
// !! this part could be refactored
// as you don't really need to check against the url
// when the cookie doesn't exist show all elements
$('.block-wrap').isotope({
filter: ''
});
}
});
});
모든 제안을 주시면 감사하겠습니다! 당신이 변경된 쿠키를로드하고 그것을 덮어 쓰는 대신에 추가 var cfilter = [];
이 방법 var cfilter = $.cookie("listfilter");
에
를 사용
당신은 내 변화를 구현하는 오류를했다. 지금은로드하고 추가하는 대신 단순히 덮어 쓰는 것입니다. –@ RenéRoth 아, 알았어, 내가 어떻게하면 이것에 대해 갈 생각이야? – user1374796
답변으로 내 솔루션을 추가했습니다. –