Question

我已经改变了基本索引页面，下拉是/否选择。默认为否。如果选择是，我希望显示文本输入标记，以便我可以输入跳过评估的原因。如果选择否，则应删除文本输入字段。

这是我的代码：

<h1 id='main_header'>test-01</h1>

<table>
  <thead>
    <th>Action<//th>
    <th>Skip assessment</th>
    <th>Reason for skipping</th>
  </thead>
  <tbody>
    <tr>
      <td>
        <%= link_to 'Start asseement', controller: :home, action: :start_assessment, id: 'start_assessment' %>
      </td>
      <td>
        <%= select_tag "skip_option", options_for_select([ "Yes", "No" ], "No"), id: "skip_option", :onchange => "reason_picker()" %>
      </td>
      <td>
        <%= text_field_tag "reason_for_skipping", nil, size: 50, placeholder: 'Enter reason here...', style: "display: none;" %>
      </td>
    </tr>
  </tbody>
</table>

<script>
  $(document).ready (
    function reason_picker () {
      var selected = document.getElementById("skip_option").selectedIndex;
      alert(selected);
      if (selected == 0) {
        $("#reason_for_skipping").show();
        alert("if");
      }
      else {
        $("#reason_for_skipping").hide();
        alert("else");
      }
    }
  );
</script>

我总是得到“else”分支，所选索引始终为1，当从下拉列表中选择“是”时（应该选择索引0），文本输入标记永远不会显示。不知道如何解决这个问题。

Answer 1

问题出在这一行

<%= select_tag "skip_option", options_for_select([ "Yes", "No" ], "No"), id: "skip_option", :onchange => "reason_picker()" %>

reason_picker()将未定义

要解决此问题，您可以轻松地重构您的javascript：

<script>
  $(document).ready (
    window.reason_picker = funtion() {  # <-- change here
      var selected = document.getElementById("skip_option").selectedIndex;
      alert(selected);
      if (selected == 0) {
        $("#reason_for_skipping").show();
        alert("if");
      }
      else {
        $("#reason_for_skipping").hide();
        alert("else");
      }
    }
  );
</script>

Rails - text_field_tag没有显示Javascript

1 个答案: