javascript - html 表单 : input requierd if Select>optinon selected

Question

如果选择了选择的选项，我会尝试将字段设置为必填。

这是要清楚的代码:) :

<div class="value">
   <h2>Are you happy ?</h2>
   <select name="happiness" required>
        <option value="1">Good</option>
        <option value="0">To improve</option>
   </select>
   <br>
   <textarea name="Comment4Happiness" placeholder="comment"></textarea>
</div>

因此，如果选择“改进”选项，则文本区域必须是强制。 如果需要，我们还可以用注释填充文本区域。但这不是强制性的!

我已经知道我必须使用 Javascript，但我不知道这个域...

Answer 1

您必须将 id 添加到表单元素中，然后在 JavaScript 中使用它们来获取它们的值，并使用提交按钮来调用该函数。

<div class="value">
   <h2>Are you happy ?</h2>
   <select id="mySelect" name="happiness" required>
        <option value="1">Good</option>
        <option value="0">To improve</option>
   </select>
   <br>
   <textarea id="myTextArea" name="Comment4Happiness" placeholder="comment"></textarea>
<button type="button" onclick="myFunction()">Submit</button>
</div>

现在将脚本标记添加到 html 底部

<script>
function myFunction() {
  let selectValue = document.getElementById("mySelect").value;
  let textAreaValue = document.getElementById("myTextArea").value;
   if (selectValue === "0") {
    if (textAreaValue === "") {
      alert("Text Area should not be empty");
    }

   }
}
</script>