占位符仅在瞬间显示

Question

我正在处理一个简单的输入表单。如果用户未输入任何内容，则应显示占位符以使用户知道应输入某个值。但占位符文本只出现一瞬间，我认为在脚本完成后重新加载并占位符消失。如何在用户输入内容之前保持这种状态？

window.onload = initForm;

function initForm() {
  document.getElementById("form").onsubmit = checkInput;
}

function checkInput() {
  var required = document.getElementsByClassName("req");
  var emptyForm = [];
  for (var i = 0; i < required.length; i++) {

    if (required[i].value == "") {
      emptyForm.push(required[i]);
    }
  }

  for (var i = 0; i < emptyForm.length; i++) {
    emptyForm[i].placeholder = "enter name";
  }
}

<form id="form">
  <p>Name: </p><input type="text" class="req" name="name">
  <input id="submit" type="submit" value="Submit">
</form>