javascript - 用户从 rails 表单中选择一个单选按钮，然后立即获得更多表单选项-coffeescript 失败

Question

我试图让用户选择一个单选按钮，并根据该单选选项立即获得更多表单选项。Divs 最初正确隐藏如下，但字段不会根据单选按钮选项显示。最初我打算让咖啡脚本尝试通过 $("input:radio[name='example']") 获取单选按钮，但是每个单选按钮的名称都不同，因为单选按钮存在的“步骤”由用户创建和删除，因此每个都有不同的名称。任何帮助，将不胜感激。

咖啡脚本

$(".excelCreator").hide()
$(".videoCreator").hide()
$(".mcCreator").hide()
$(".stepRadio").change ->
  if @value is "video" and @checked
    $(".videoCreator").show()
  else if @value is "excel" and @checked
    $(".excelCreator").show()
  else if @value is "multiple_choice" and @checked
    $(".mcCreator").show()
  else
    $(".excelCreator").hide()
    $(".videoCreator").hide()
    $(".mcCreator").hide()

这是带有单选按钮的显示视图

 <div>
    <div>
      <%= f.label :media_type, "Excel" %>
      <%= f.radio_button :media_type, 'excel', :checked => true, class: 'icheck stepRadio' %>
    </div>
    <div>
      <%= f.label :media_type, "Video" %>
      <%= f.radio_button :media_type, 'video', class: 'icheck stepRadio' %>
    </div>
    <div>
      <%= f.label :media_type, "Multiple Choice" %>
      <%= f.radio_button :media_type, 'multiple_choice', class: 'icheck stepRadio' %>
    </div>
</div>

这是我希望在同一视图中根据上面的单选按钮显示的选项

<div class="excelCreator">
    <%= f.label :link, "Excel Link" %>
    <%= f.text_field :link, :style => "width: 98%;" %>
    <%= f.label :answer, "Excel Answer (#)" %>
    <%= f.text_field :answer, :style => "width: 98%;" %>
</div>

<div class="videoCreator">
    <%= f.label :link, "Video Link" %>
    <%= f.text_field :link, :style => "width: 98%;" %>
</div>

<div class="mcCreator">
    <%= f.label :choice_one, "Choice One" %>
    <%= f.text_field :choice_one, :style => "width: 98%;" %>
    <%= f.label :choice_two, "Choice Two" %>
    <%= f.text_field :choice_two, :style => "width: 98%;" %>
    <%= f.label :choice_three, "Choice Three" %>
    <%= f.text_field :choice_three, :style => "width: 98%;" %>
    <%= f.label :choice_four, "Choice Four" %>
    <%= f.text_field :choice_four, :style => "width: 98%;" %>
    <%= f.label :answer, "MC Answer (#)" %>
    <%= f.text_field :answer, :style => "width: 98%;" %>
</div>

这是为表单字段之一输出的 html 示例

 <div>
      <label for="course_levels_attributes_0_steps_attributes_0_media_type">Excel</label>
      <input checked="checked" class="icheck stepRadio" id="course_levels_attributes_0_steps_attributes_0_media_type_excel" name="course[levels_attributes][0][steps_attributes][0][media_type]" type="radio" value="excel" />
    </div>