仅通过数组切换原型切换最后一项答案

【问题标题】：Prototype Toggle through Array Only Toggling Last Item仅通过数组切换原型切换最后一项
【发布时间】：2010-01-24 06:06:35
【问题描述】：

我是初学者，我哥哥给我看了一些原型。所有的星期都成功地切换了数组中的最后一周，但没有其他的。如果我需要更具体，请告诉我！谢谢！

<%= @athletic_program.program_name %>
<br>
<br>

<% array of_ids = Array.new %>

<% @program_weeks.each do |program_week| %>
  <% array_of_ids.push(program_week.id) %>
  <div id="week_number_<%= program_week.id %>" class="week_number">Week <%=program_week.week_number %></div>
<div id="program_week_form_<%= program_week.id %>" class="program_week_form">
    <% form_for(program_week) do |f| %>
      <%= f.error_messages %>
      Number of Workouts <%= f.select :number_of_workouts, (1..7), {} %>
      <%= f.submit 'Next' %>
    <% end %>
  </div>
<% end %>

<% content_for :javascript do %>
<script type="text/javascript">
function showForms(array_of_ids){
  for(var i=0;i<array_of_ids.length;i++){
    id = array_of_ids[i];
    week_id = "week_number_" + array_of_ids[i];
    $(week_id).onclick = function(event){
      program_form = "program_week_form_" + id;
      form_div = $(program_form);
      if (form_div.style.display == 'none'){
        form_div.style.display = 'block';
      } else {
        form_div.style.display = 'none';
      }
    }
  }
}

showForms(<%= array_of_ids.to_json %>);
</script>
<% end %>

以下现在有效！

<%= @athletic_program.program_name %>
<br>
<br>

<% @program_weeks.each do |program_week| %>
  <div id="week_number_<%= program_week.id %>" class="week_number" onclick="$('program_week_form_<%= program_week.id %>').toggle()">Week <%=program_week.week_number %></div>
  <div id="program_week_form_<%= program_week.id %>" class="program_week_form" style="display:none;">
    <% form_for(program_week) do |f| %>
      <%= f.error_messages %>
      Number of Workouts <%= f.select :number_of_workouts, (1..7), {} %>
      <%= f.submit 'Next' %>
    <% end %>
  </div>
<% end %>

我添加了 style="display:none;"到 program_week_form_ 使其默认隐藏。

【问题讨论】：

标签： javascript ruby-on-rails ruby prototype

【解决方案1】：

您是否只是想在单击星期 div 时切换表单？在这种情况下，你真的是走错路了。

如果您使用 Prototype，我认为您可以删除所有 javascript 和 array_of_ids 并将星期 div 更改为此：

<div id="week_number_<%= program_week.id %>" class="week_number" onclick="$('program_week_form_<%= program_week.id %>').toggle()">Week <%=program_week.week_number %></div>

【讨论】：

谢谢！我在 onclick 方法中添加了一个额外的单引号，它可以工作！再次感谢！
我的印象是最好不要将 javascript 内联，但这主要是由于 IRC 聊天中的建议，我不明白为什么。你怎么认为？ stackoverflow.com/questions/543790/…
@todd，很好。对此感到抱歉:) @tenjack，你是对的。最佳实践是编写不显眼的 JS，但考虑到原始代码以及 OP 刚刚从 Prototype/JS 开始这一事实，我认为这是向前迈出的简单一步。