用下拉菜單鏈接文本框

Question

我正在編寫一個包含下拉菜單的程序，它包含一些如下所示的默認值：

<%= f.select :securtiy_question, options_for_select([["Select a question.."],
          ["What is your previous cell number?"], ["What is your fathers name?"], ["write your question"]]),{}, :onchange => 'CheckOther(this);' %>

HTML的輸出是：

<select id="user_securtiy_question" name="user[securtiy_question]" onchange="CheckOther(this);"><option value="Select a question..">Select a question..</option><option value="What is your prevoius cell number?">What is your prevoius cell number?</option><option value="What is your fathers name?">What is your fathers name?</option><option value="write your question">write your question</option></select>

我想在下拉菜單中單擊“寫下您的問題”時顯示一個文本框。 為此，我制作了一個空的文本框，顯示為空。

<%= f.text_field :own_ques, :style => "display: none;"%>

現在，我在自己的視圖中制作一個JAVAScript：

<script type="text/javascript">
  CheckOther = (user_securtiy_question) -> if user_securtiy_question.selectedIndex is user_securtiy_question.options_for_select.length - 1 document.getElementById("user_own_ques").style.display = "inline" else document.getElementById("user_own_ques").style.display = "none" document.getElementById("user_own_ques").value = "" return </script>

但仍然無法看到文本框出現有人，請提出解決方案...

Answer 1

您可以在頁面中使用簡單的jquery。

$("#user_securtiy_question").change(function(){
  $("#user_own_ques").val('');
  if(this.val()== "write your question"){
    $("#user_own_ques").show();
  }else{
    $("#user_own_ques").hide();
  }
});