JQuery Cookie не работает

Question

У меня была функция javascript showHide (shID), которая является функцией скрыть div и показать содержимое после нажатия «читать дальше». Вот моя Fiddle: Fiddle

после добавления в эту функцию JQuery Cookie, похоже на функцию showHide (shID), может ли кто-нибудь помочь мне исправить это? спасибо, мне очень нужна помощь. here my Fiddle: Fiddle

Мне нужно сделать smtg следующим образом: сначала нажмите «readmore», скрытый контент покажет, после того, как cookie cookie и пользователь вернутся, чтобы увидеть мою скрытую страницу на странице, которая показывается.

<div id="wrap"> 
    <a href="#" id="example-show" class="showLink" onclick="showHide('example');"> 
     <button class="btn-u btn-u-lg btn-block btn-u-dark-orange"> 
     Read More 
     </button> 
    </a> 
    <div id="example" class="more"> 
     <iframe width="600" height="315" src="//www.youtube.com/embed/BaPlMMlyM_0" frameborder="0" allowfullscreen></iframe> 
     <p>Congratulations! You've found the magic hidden text! Clicking the link below will hide this content again.</p> 
    </div> 
</div> 

Answer 1

Я изменил логику сценария немного: показать содержание, когда showhide-... установлен в 1. Также я добавил параметр к функции showHide: setCookie. Когда это false, cookie не установлен/изменен.

function showHide(setCookie) { 
    var shID = $(this).data("showhide") 
     , $shEl = $("#" + shID) 
     , $showHide = $("#" + shID + '-show') 
     ; 

    if ($shEl.is(":hidden")) { 
     if (setCookie !== false) { 
      jQuery.cookie("showhide-" + shID, 1); 
     } 
     $showHide.hide(); 
     $shEl.show(); 
    } else { 
     if (setCookie !== false) { 
      jQuery.cookie("showhide-" + shID, 0); 
     } 
     $showHide.show(); 
     $shEl.hide(); 
    } 
} 

jQuery(document).ready(function() { 
    $("#example-show").on("click", showHide); 
    if (jQuery.cookie("showhide-" + "example") == '1') { 
     showHide.call($("#example-show").get(0), false); 
    } 
}); 

Чтобы добавить истекают дату, просто передать третий аргумент $.cookie вызова:

var date = new Date(); 
var minutes = 30; 
date.setTime(date.getTime() + (minutes * 60 * 1000)); 
$.cookie("example", "foo", { expires: date }); 

(обратитесь к How to expire a cookie in 30 minutes using jQuery? для получения дополнительной информации)

JSFIDDLE

Answer 2

Названия печенья чувствительны к регистру, и вы должны прочитать одно и то же имя cookie, которое вы задали раньше. В вашем случае вы установили jQuery.cookie("showHide-"+shID, 1) и отметьте jQuery.cookie("showhide-" + "example"). «showHide-» и «showhide-» несовместимы.

EDIT:

if (document.getElementById(shID + '-show').style.display != 'none') { 
     // Set cookie when button has been clicked 
     jQuery.cookie("showhide-"+shID, 1); 
     // ... 
    } else { 
     jQuery.cookie("showhide-"+shID, 0); 
     // ... 
    } 

    if (jQuery.cookie("showhide-" + "example") == 1) { 
     // Trigger button click if cookie is set 
     $("#example-show").trigger("click"); 
    }