Question

我正在学习javascript，我正在尝试对表单进行简单的验证。我在表单上放置onblur事件并且它不起作用但如果事件放在输入本身上它确实有效。如果有人可以帮我解决这个问题，那就太好了。

function checkInfo() {
  var name = document.getElementById('name').value,
    email = document.getElementById('email').value;
    
  if(name === '' || email === '') {
    console.log('validate');
    return false;
  }
  else {
    return true;
  }
};

<form method="post" name="myForm" id="my-form" onblur="checkInfo();">
  <div>
    <input type="text" id="name" name="name" placeholder="Name (Required)" required>
  </div>
  <div>
    <input type="email" id="email" name="email" placeholder="Email (Required)" required>
  </div>
  <div>
    <input type="text" id="subj" placeholder="Subject">
  </div>
  <div>
    <textarea cols="30" rows="10" placeholder="Describe your project in detail..."> </textarea>
  </div>
</form>

Answer 1

更改以下代码

<form method="post" name="myForm" id="my-form" onblur="checkInfo();">

到

<form method="post" name="myForm" id="my-form" onsubmit="return checkInfo()">

它应该工作。您可能还想在表单中添加操作属性，例如：

<form method="post" action = "demo_form.asp" name="myForm" id="my-form" onsubmit="return checkInfo()">

表示在提交时，将表单数据发送到名为“demo_form.asp（或demo_form.php等）”的文件，以处理输入。

如何使这个验证工作？

1 个答案: