如何使html5所需的验证器与输入type=button一起工作？

<form>
  <input type="text" required>
  <input type="button" value="Submit" onclick="validateForm()">
</form>

<script>
function validateForm() {
  var input = document.querySelector('input[type="text"]');
  if (!input.checkValidity()) {
    input.setCustomValidity("Please fill out this field.");
  } else {
    // 执行提交操作
  }
}
</script>

<form>
  <input type="text" required>
  <input type="button" value="Submit" onclick="validateForm()">
</form>

<script>
function validateForm() {
  var form = document.querySelector('form');
  form.reportValidity();
}
</script>