如何选择datalist选项

Question

我正在尝试创建一个注册表单，我需要为选择特定选项的用户显示第二选择，你看到错误在哪里吗？

 <div> <label for="prof_ecm">Dichiaro di essere:</label> <input type="text" list="prof_k" class="form-control" name="prof_ecm" id="prof_ecm" placeholder="* campo obbligatorio" required> <datalist id="prof_k"> <option value="Dipendente" id="dipen" onClick="dip()"> <option value="Convenzionato"> <option value="Libero professionista"> <option value="Privo di occupazione"> </datalist> </div> <div id="div_ente" style="display: none;"> <label for="ente">Se dipendente, specificare l'Ente</label> <input type="text" class="form-control" name="ente" id="ente"> </div> <script> function dip() { var element = document.getElementById("dipen").value; if (element = "dipendente") { document.getElementById("div_ente").style.display = "inline"; } } </script> 

Answer 1

我<optgroup>地知道您的问题所在，但如果您想在select标签中创建组，则可以尝试<optgroup>标签（ optgroup ）。 如果您想要更改或创建新的select标记，则必须在JavaScript中执行此操作。

Answer 2

捕获输入元素的onchange事件而不是下面的选项元素，

 function dip(element) { if (element.value == "Dipendente") { document.getElementById("div_ente").style.display = "inline"; } }; 

 <div> <label for="prof_ecm">Dichiaro di essere:</label> <input type="text" list="prof_k" class="form-control" name="prof_ecm" id="prof_ecm" placeholder="* campo obbligatorio" required onchange="dip(this)" > <datalist id="prof_k"> <option value="Dipendente"> <option value="Convenzionato"> <option value="Libero professionista"> <option value="Privo di occupazione"> </datalist> </div> <div id="div_ente" style="display: none;"> <label for="ente">Se dipendente, specificare l'Ente</label> <input type="text" class="form-control" name="ente" id="ente"> </div> 

你也有很少的错别字，例如选项值是“Dipendente”，你正在检查“dipendente”，以及最后的额外结束括号。