ruby​​「each do」and scriptaculous Effect.BlindDown/Up

Question

我有一個項目列表，其中包含一些我想在點擊顯示/隱藏細節鏈接時顯示的細節。經過一些實驗後，我遇到了兩個問題。

1. 我很難使它顯示/隱藏鏈接只顯示特定項目的div。現在，點擊任何顯示/隱藏鏈接時，它會顯示所有div。

2. 此外，必須有一個更優雅的方式來做到這一點，而不需要做一個循環來生成一堆javascript。我看着效果。多種，但我不知道如何在這種情況下使用它。

一些洞察力或指向大方向將不勝感激！ 謝謝！

這裏是供參考的代碼。

    <script type="text/javascript"> 
     function show_details() { 
      <% @posts.each do |b| %> 
     Effect.BlindDown('details_<%= b.id %>', {duration:0.3}); 
     $('hide_details_link_<%= b.id %>').style.display = 'inline'; 
     $('show_details_link_<%= b.id %>').style.display = 'none'; 
     <% end %> 
     } 

     function hide_details() { 
      <% @posts.each do |b| %> 
     Effect.BlindUp('details_<%= b.id %>', {duration:0.3}); 
     $('hide_details_link_<%= b.id %>').style.display = 'none'; 
     $('show_details_link_<%= b.id %>').style.display = 'inline'; 
     <% end %> 
     } 
    </script> 

<ul id="posts"> 
    <% @posts.each do |b| %> 
      <li> 



    <div id="show_details_link_<%= b.id %>" style="display:inline;"> 
     <%= link_to_function "show details", 'show_details()' %> 
    </div> 

    <div id="hide_details_link_<%= b.id %>" style="display:none;"> 
     <%= link_to_function "hide details", 'hide_details()' %> 
    </div> 


    <div id="details_<%= b.id %>" style="display:none;"> 

     <p> <%= b.comments %></p> 


    </div> 



        </li> 
     <li><%= link_to b.title, {:action => 'show', :id => b.id} -%></li> 

     <% end %> 
    </ul> 

Answer 1

它看起來對我來說，所有的顯示/隱藏鏈接調用同一個功能（show_details()等），這顯示/隱藏（因爲循環的）的所有帖子，而不是具體的人。而不是定義一個函數爲每一個更優雅的方式來解決，這將是這樣的：

<%= link_to_function "show details", "Effect.BlindDown('details_<%= b.id %>', {duration:0.3});" %> 

這當然不是不顯眼，但它是一個開始。

編輯

我只注意到要顯示隱藏每個div的，以及你的鏈接。嗯，你可以遮擋效果後拋出右：

<%= link_to_function "show details", "Effect.BlindDown('details_<%= b.id %>', {duration:0.3});$('hide_details_link_<%= b.id %>').style.display = 'inline';" %> 

等

或者你可以讓其中找到所有的div和函數綁定到他們每個人的文檔的onload功能一個JavaScript循環，但是這比我想要演示的要複雜得多，尤其是當你看起來並沒有使用Prototype時（儘管你使用的是Scriptaculous？這應該讓你訪問.show（）/。hide（）助手......）

另外，爲什麼使用div？您可以直接鏈接到鏈接（請參閱link_to_function上的選項）