2010-04-25 106 views
0

我有30個div在同一頁上具有相同的類。當我按標題(.pull)時,內容向上滑動(.toggle_container)。當內容被隱藏並且我再次按下標題時,內容就會滑落。此外,我想存儲一個cookie內的div狀態。 我修改了我的原始代碼,將div狀態存儲在cookie中,但它不適用於所有div(pull1,toggle_container1,pull2,toggle_container2 [...]),它僅適用於第一個(pull0,toggle_container0)。 我做錯了什麼?增量變量爲

var increment = 0; 
      if ($.cookie('showTop') == 'collapsed') { 
       $(".toggle_container" + increment).hide(); 
      }else { 
       $(".toggle_container" + increment).show(); 
     }; 
      $("a.pull" + increment).click(function() { 
      if ($(".toggle_container" + increment).is(":hidden")) { 
       $(".toggle_container" + increment).slideDown("slow"); 
       $.cookie('showTop', 'expanded'); 
       increment++; 
      } else { 
       $(".toggle_container" + increment).slideUp("slow"); 
       $.cookie('showTop', 'collapsed'); 
       increment++; 
      } 
      return false; 

      });  

回答

1

這是代碼:

$('div.toggle_container').each(function() { // Initialise 
     var index = this.id.replace(/^\D+/, ''); 
       $(this).toggle($.cookie('showTop' + index) == 'collapsed'); 
      }); 

    $('a.pull').click(function() { //Activate     
     var index = this.id.replace(/^\D+/, ''); 
     if ($.cookie('showTop' + index) == 'collapsed') { 
     var container = $('#toggle_container' + index).slideDown('slow'); 
     $.cookie('showTop' + index, container.is(':hidden') ? 'collapsed' : 'expanded'); 
     }else { 
     var container = $('#toggle_container' + index).slideUp('slow'); 
     $.cookie('showTop' + index, container.is(':visible') ? 'expanded' : 'collapsed'); 
      } 
}); 
1

我還沒有嘗試過任何代碼的, 但不會$( 「a.pull」 +增量)= $( 「a.pull0」)? 和我沒有看到任何循環,所以增量0選擇器是唯一一個將被執行?

jQuery選擇看可能是 http://api.jquery.com/attribute-starts-with-selector/ 如果你可以選擇具有與.pull(或其他)開始一類的div,而不必綁定到30周不同的div話,我想你的代碼會更高性能。

+0

它不工作,因爲我試圖使用從終端數量的div分開。如果我使用選擇器並按下a.pull0,所有div都會滑動。我試圖一次切換一個div,而不是所有的div。 – 2010-04-25 09:23:29