选择特定组合框选项时如何启用特定文本框

Question

抱歉，我是 html 的新手，我想问一下如何在选择了特定的组合框选项时启用特定的文本框。

我看过主题 how to activate a textbox if I select an other option in drop down box，但我不明白我做错了什么。

我希望选择一个组合框选项（例如Option1），以启用使用“ thress1”，“ thress2”，“课程3”的组合框选项（例如Option2）启用文本框，以启用使用“ nork thress4”，Thress5，Thress5，Thress6等等供用户填写。

这是我的代码

function Select(val) {
  var element=document.getElementById("options1");
  var element2=document.getElementById("options2");
  var element3=document.getElementById("options3");
  if (val=="option 1"){
      element.style.display="block";
   else 
      element.style.display="none"; }
else if (val=="option2"){
      element2.style.display="block";
   else 
      element2.style.display="none"; }
else if (val=="option 3"){
      element3.style.display="block";
   else 
      element3.style.display="none"; }
  }

<label class="formLabel">
    Options*</label><br />
<select name="select2" required="" onchange="Select(this.value);">
    <option disabled="disabled" selected="selected" value=""></option>
    <option value="">option 1</option>
    <option value="">option 2</option>
    <option value="">option 3</option>
</select><br />
<div id="options1" style="display: none;">
    <label class="classLabel">
        lesson 1*
    </label>
    <label class="classLabel">
        lesson 2*</label>
    <label class="classLabel">
        lesson 3*</label><br />
    <input class="formText" name="field7" required="" type="text" />
    <input class="formText" name="field8" required="" type="text" />
    <input class="formText" name="field9" required="" type="text" /><br />
</div>
<div id="options2" style="display: none;">
    <label class="classLabel">
        lesson 4*
    </label>
    <label class="classLabel">
        lesson 5*</label>
    <label class="classLabel">
        lesson 6*</label><br />
    <input class="formText" name="field10" required="" type="text" />
    <input class="formText" name="field11" required="" type="text" />
    <input class="formText" name="field12" required="" type="text" /><br />
</div>
<div id="options3" style="display: none;">
    <label class="classLabel">
        lesson 7*
    </label>
    <label class="classLabel">
        lesson 8*</label>
    <label class="classLabel">
        lesson 9*</label><br />
    <input class="formText" name="field13" required="" type="text" />
    <input class="formText" name="field14" required="" type="text" />
    <input class="formText" name="field15" required="" type="text" /><br />
</div>
<input id="submitButton" type="submit" value="send" /></form> </div>

Answer 1

您有未向组合框添加值，组合框必须类似于

<select name="select2" required="" onchange="Select(this.value);">
    <option disabled="disabled" selected="selected" value=""></option>
    <option value="option 1">option 1</option>
    <option value="option 2">option 2</option>
    <option value="option 3">option 3</option>
</select>

并且您的 js 脚本中也存在一些语法错误

请尝试以下代码

if else 的语法错误

<script>function Select(val) {
  var element=document.getElementById("options1");
  var element2=document.getElementById("options2");
  var element3=document.getElementById("options3");
  if (val=="option 1")
      element.style.display="block";
   else 
      element.style.display="none"; 
 if (val=="option 2")
      element2.style.display="block";
   else 
      element2.style.display="none"; 
 if (val=="option 3")
      element3.style.display="block";
   else 
      element3.style.display="none"; 

  }
</script>

Answer 2

<script>
    function Select(val) {
      var element=document.getElementById("options1");
      var element2=document.getElementById("options2");
      var element3=document.getElementById("options3");
      if (val=="option 1")
          element.style.display="block";
       else 
          element.style.display="none"; 
     if (val=="option 2")
          element2.style.display="block";
       else 
          element2.style.display="none"; 
     if (val=="option 3")
          element3.style.display="block";
       else 
          element3.style.display="none"; 

      }
    </script>



      
    <label class="formLabel">Options*</label><br />


    <select name="select2" required=""  onchange="Select(this.value);">
    <option disabled="disabled" selected="selected" value=""></option>


     
    <option value="option 1">option 1</option>

    <option value="option 2">option 2</option>

    <option value="option 3">option 3</option></select><br />

    <div id="options1"  style="display:none;">

    <label class="classLabel">lesson 1* </label>
    <label class="classLabel">lesson 2*</label>
    <label class="classLabel" >lesson 3*</label><br />
     <input class="formText" name="field7" required="" type="text"  />
    <input class="formText" name="field8  required="" type="text"  />
    <input class="formText" name="field9" required="" type="text"  /><br />
    </div>
     


    <div id="options2"   style="display:none;">

    <label class="classLabel" >lesson 4* </label>
    <label class="classLabel">lesson 5*</label>
    <label class="classLabel" >lesson 6*</label><br />
     <input class="formText" name="field10" required="" type="text"  />
    <input class="formText" name="field11" required="" type="text"  />
    <input class="formText" name="field12" required="" type="text"  /><br />
    </div>
     


    <div id="options3"  style="display:none;">

    <label class="classLabel">lesson 7* </label>
    <label class="classLabel">lesson 8*</label>
    <label class="classLabel">lesson 9*</label><br />
     <input class="formText" name="field13" required="" type="text"   />
    <input class="formText" name="field14" required="" type="text"  />
    <input class="formText" name="field15" required="" type="text"  /><br />
    </div>
     


    <input id="submitButton" type="submit" value="send" /></form>
    </div>

选择特定组合框选项时如何启用特定文本框

How can i enable specific textboxes when a specific combo box option is chosen

html

combobox

textbox