Question

在这个问题中，我想显示一些HTML文本，具体取决于在表单中选择的选项组合。例如，在这个例子中，如果选择拼写作为子类别并且“更深入”，则我想显示一些文本。（相当于＆＃39; A＆＃39;等级）被选为绩效等级。我已经在Rails form_for中开发了这个，但是已经在浏览器中显示了表单。

<form class="new_english_grade" id="new_english_grade" action="/english_grades" accept-charset="UTF-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="VTtOS/86shuyQPW6/HfaduffmQiVXLiJb06IQp7+56LM8cD8KRnD3qLGbQBit4OuAIc92MYbFpPObR6ePYmY1g==" />

      <div class="field">
        <label for="english_grade_subcategory">Subcategory</label>
        <select name="english_grade[subcategory]" id="english_grade_subcategory"><option value="Spelling">Spelling</option>
    <option value="Reading">Reading</option>
    <option value="Writing">Writing</option></select>
      </div>

      <div class="field">
        <label for="english_grade_performance_grade">Performance grade</label>
        <select name="english_grade[performance_grade]" id="english_grade_performance_grade"><option value="Not-started">Not-started</option>
    <option value="Working-towards">Working-towards</option>
    <option value="Working-at">Working-at</option>
        <option value="Greater-depth">Greater-depth</option></select>
      </div>
</form>

我想要显示的文字如下：

<div id = "spelling_greater_depth">
  This text is displayed only if 'spelling' and 'greater-depth' are selected in options
</div>

我最初将CSS设置为：

#spelling_greater_depth
{
  display: none;
}

我的JavaScript还没有真正起作用所以我没有包含它，但我试图使用this来实现它：

Answer 1

我认为这可能足以让你开始http://en.cppreference.com/w/cpp/utility/variant/variant

然而，回答这个问题非常困难，如果问题很接近，你能澄清一下你的问题或对这个问题给出反馈吗？

 $('select[name="english_grade"]').change(function () {
  $('#spelling_working_at').css("display","none");
  console.log($(this).val());
  var fieldToShow = $(this).val();
  $("#" + fieldToShow).css("display","block");
});

使用JavaScript从表单中的多个条件显示文本

1 个答案: