为简单表单集合选项分配 id

Question

新开发人员尝试为 Round Oval 和 Banana 选项分配不同的 id，以便可以在选择时启动操作：

<%= f.input :content, label: 'Fruit Shape', :collection => %w[Round Oval Banana] %>

但所有选项始终具有 id 'update_content'，我认为是由于 Update 实例所致。

$('#Round').on('click', function(){
    $("#round_div").show();
  })

失败。根据我尝试过的研究：

:collection => %w[Round Oval Banana].map { |category| [category, {:id => category}]}

生成

<select class="form-control select optional valid" name="update[content]" id="update_content" aria-invalid="false"><option value="">SELECT</option>
<option id="Round" value="Round">Round</option>
<option id="Oval" value="Oval">Oval</option>
<option id="Banana" value="Banana">Banana</option></select>

以及其他变体，例如：

collection: [["Round", {:id => "round"}], ["Oval", {:id => "oval"}], ["Banana", {:id => "banana"}]],

但 round_div 不显示

Answer 1

...是 jquery 问题

$('#update_content').change(function(){
    var selectedValue = $(this).val();
    if (selectedValue == "Round") {
      show_round();
    } else if (selectedValue == "Oval") {
      show_oval();
    } else if (selectedValue == "Banana") {
      show_banana();
    }
  })