如何使用if select语句的选择形式？

Question

在我的注册页面中，我将使用两个下拉选项，其中一个应该被隐藏，如果它是负面的，如果它的积极的新下拉将打开选择.

mysql表中的--我用作为糖尿病名称 enum(‘阴性’，‘胰岛素’，‘药物’，'ndm'，'mody'，'')

这是我的密码：

​

<div><label for="diabetes">Diabetes:</label>
<select id="diabetes" name="diabetes">
<option value="negative">Negative</option>
<option value="">Positive</option>
</select>
</div>



<div><label for="diabetestype">Diabetes Type:</label>
<select id="diabetestype" name="diabetestype">
<option value="insulin">Insulin</option>
<option value="drug">Drug</option>
<option value="ndm">NDM</option>
<option value="mody">MODY</option>
</select>
</div>

​

例如:如果糖尿病为负值，则值为负值，则糖尿病类型为隐藏

和

如果糖尿病为阳性，则糖尿病型将出现选择项目。

应该将胰岛素、药物、mdm、mody等值插入其中：

value="positive"

我怎样才能通过java脚本实现它呢？

我不能加类、分、跨。是否可以仅通过JavaScript使用?？

非常感谢

Answer 1

使用jquery，相对容易一些。

$(document).ready(function(){
 $("#diabetestype").hide();
 $("#diabetes").on("change", function(){
   var v = $(this).val();
   if(v=="positive"){
      $("#diabetestype").show();
   }else{
     $("#diabetestype").hide();
   } 
 });
});

要使这段代码可行，还需要添加Positive选项的值。因此，value=""将其改为value="positive"。

您甚至可以隐藏标签：

$(document).ready(function(){
 $("#diabetestype").closest("div").hide();
 $("#diabetes").on("change", function(){
   var v = $(this).val();
   if(v=="positive"){
      $("#diabetestype").closest("div").show();
   }else{
     $("#diabetestype").closest("div").hide();
   } 
 });
});

Answer 2

<div><label for="diabetes">Diabetes:</label>
  <select id="diabet" name="diabet" onchange="checkDiabet();">
    <option value="negative">Negative</option>
    <option value="positive" id="isDiabet">Positive</option>
  </select>
</div>

<div id="type" style="display: hidden;">
  <label for="diabetestype">Diabetes Type:</label>
  <select id="diabetestype" name="diabetestype">
    <option value="insulin">Insulin</option>
    <option value="drug">Drug</option>
    <option value="ndm">NDM</option>
    <option value="mody">MODY</option>
  </select>
</div>

<script>
function checkDiabet() {
  var isDiabet = document.getElementById("isDiabet").selected;
  if (isDiabet == true) { document.getElementById("type").removeAttribute("style"); }
  else { document.getElementById("type").style.display = "none"; }
}
</script>

首先，将第一个select设置为通过onchange属性触发函数checkDiabet()。然后给这个选项一个id，这个id需要检查，这样您就可以很容易地访问它。

然后，将第二个select设置为display:没有一个可以在CSS头或文件中完成，或者类似于本例中的内联。(div style="")，还添加了一个id以方便地访问它。(div id="type")

接下来是函数checkDiabete()。它检查select是否被选中(可以为true或false (bool))。如果没有，则隐藏此div (及其所有内容)。

(如果已经隐藏，则用(style="display: none;")覆盖(style="display: none；“)

就这样！:)

Answer 3

试试这个：

​

function SelectDiabetes() {
  var d = document.getElementById("diabetes").value;
  var dType = document.getElementById("diabetestypebox");
  if(d == "negative")
    dType.style.display = "none";
  else
    dType.style.display = "block";
}

SelectDiabetes();

<div><label for="diabetes">Diabetes:</label>
<select id="diabetes" name="diabetes" onchange="SelectDiabetes(this.value);">
<option value="negative">Negative</option>
<option value="positive">Positive</option>
</select>
</div>



<div id="diabetestypebox"><label for="diabetestype">Diabetes Type:</label>
<select id="diabetestype" name="diabetestype">
<option value="insulin">Insulin</option>
<option value="drug">Drug</option>
<option value="ndm">NDM</option>
<option value="mody">MODY</option>
</select>
</div>

​