クッキーに保存する簡単な隠し/表示

Question

ページを更新するときにクッキーが保存されないのはなぜですか？

http://jsfiddle.net/jBVBL/

それとも使用 ".active"

var hideshow = $(".hideShow"); 

hideshow.children().not(".active").each(function(index, value){ 
    var tis = $(this); 

    if($.cookie('hideShow_id'+index) == index){ 
     tis.addClass(".active"); 
    } else { 
     $(this).find("div").hide(); 
    }    
}); 

hideshow.find('h3').click(function(e){ 
    var tis = $(this); 
    var tisindex= tis.parents("li").index; 
     $.cookie('hideShow_id' + tisindex, tisindex); 

     tis.next().slideToggle('2000'); 
     tis.parent().toggleClass('active'); 
    e.preventDefault(); 
}); 


<ul class="hideShow"> 
     <li class="active"> 
     <h3><a href="javascript:;">Pellentesque nec leo cursus ipsum rhoncus volutpat nec eget mi.</a></h3> 
     <div> 
       <p>Nam velit metus, vulputate eget sodales ut, dignissim vehicula nisi. Lorem ipsum dolor sit amet</p> 
      <ul> 
       <li> 
        <strong>Pellentesque</strong> nec leo cursus ipsum rhoncus volutpat nec eget mi.</li> 
       <li> 

        <strong>Nam</strong> quis lectus enim, ac euismod urna.</li> 
       <li> 
        <strong>Donec</strong> varius massa augue, at feugiat tortor.</li> 
      </ul> 
     </div> 
    </li> 
    <li> 
    <h3><a href="javascript:;">Pellentesque nec leo cursus ipsum rhoncus volutpat nec eget mi.</a></h3> 
    <div> 
      <p>Nam velit metus, vulputate eget sodales ut, dignissim vehicula nisi. Lorem ipsum dolor sit amet</p> 
     <ul> 
      <li> 
       <strong>Pellentesque</strong> nec leo cursus ipsum rhoncus volutpat nec eget mi.</li> 
      <li> 

       <strong>Nam</strong> quis lectus enim, ac euismod urna.</li> 
      <li> 
       <strong>Donec</strong> varius massa augue, at feugiat tortor.</li> 
     </ul> 
    </div> 
    </li> 
    <li> 
    <h3><a href="javascript:;">Pellentesque nec leo cursus ipsum rhoncus volutpat nec eget mi.</a></h3> 
    <div> 
      <p>Nam velit metus, vulputate eget sodales ut, dignissim vehicula nisi. Lorem ipsum dolor sit amet</p> 
     <ul> 
      <li> 
       <strong>Pellentesque</strong> nec leo cursus ipsum rhoncus volutpat nec eget mi.</li> 
      <li> 

       <strong>Nam</strong> quis lectus enim, ac euismod urna.</li> 

     </ul> 
    </div> 
    </li> 
</ul> 

ですべてのリーの値のみ1クッキーを保存するためのより良い練習になります：https://raw.github.com/carhartl/jquery-cookie/master/jquery.cookie.js

Answer 1

インデックスごとに異なるCookieを作成していますが、ページの読み込み時に探すCookieと一致することはありません。さらに、異なるクッキー名の文字列 'hideShow-id'と 'hideShow_id'を比較します。

Answer 2

if($.cookie('hideShow-id') == index){ 

と

を

$.cookie('hideShow_id' + tisindex, tisindex); 

は明らかに2枚の完全に異なるクッキーです

EDIT：

あなたはまた、恐ろしくindexを悪用されています。まず第一に、それは関数であり、プロパティではありません。それでも、あなたは二つの異なるインデックス

tis.parents("li").index() 

が混乱しているので、負荷に異なるインデックスを取得し、クリックしてインデックスされる予定されている場合はその兄弟の中でliタグ、どこでしょう

.each(function(index, value) 

として .not(".active")の部分のために、あなたが反復しているセット内のインデックスを明らかに2つの異なるセットにします。