Question

<form action="demo_form.asp">
  Username: <input type="text" name="usrname" required >
<div required style="-webkit-user-modify: read-write;width:100px;height:100px;border:1px solid black;"></div>
<input type="submit">
</form>

在上面的代码中，div是可编辑的，我想强制div，如果div为空则不应触发表单提交。目前文本框只是必填字段，我不知道如何使div强制

提前致谢。

Answer 1

是的，这可以使用JavaScript完成：

<form action="demo_form.asp" id="frmMain">
  Username:
  <input type="text" name="usrname" required>
  <div id="requiredDiv" style="-webkit-user-modify: read-write;width:100px;height:100px;border:1px solid black;"></div>
  <input type="submit">
</form>
<script>
  var frmMain = document.getElementById("frmMain");
  frmMain.onsubmit = function() {
    var requiredDiv = document.getElementById("requiredDiv");
    if (requiredDiv.innerHTML.trim().length == 0) {
      alert("Please fill the div as well.");
      return false;
    }
  };
</script>

如何在表格中制作Div元素可编辑和必填字段

1 个答案: