检查 HTML 输入是否完成

Question

我正在尝试使用 LocalStorage、HTML 和 Javascript 编写登录/注册系统。 现在我想检查一个 HTML 输入元素是否已填写或是否正常。 我还没有找到合适的帖子。 有人能帮我吗？

HTML 代码：

<input id="register-input1" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="Given name" name="ri1">
<input id="register-input2" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="Surname" name="ri2">
<input id="register-input3" name="ri5" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="E-Mail address">
<input id="register-input4" type="password" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="Password" name="ri3">
<input id="register-input5" type="password" autocorrect="off" autocapitalize="off" spellcheck="false" placeholder="Repeat Password" name="ri4">

Javascript 代码：

var givenname = document.getElementById('register-input1');
var surname = document.getElementById('register-input2');
var email = document.getElementById('register-input3');
var password = document.getElementById('register-input4');
var password2 = document.getElementById('register-input5');

function storeRegisterData() {
  localStorage.setItem('givenname', givenname.value);
  localStorage.setItem('surname', surname.value);
  localStorage.setItem('email', email.value);
}

function checkRegisterData() {
  if(password.value !== password2.value) {
    alert('The first password does not match the second!')
  }else{
    --The review should be here!--
  }
}

（用谷歌翻译的翻译，可能包括错误！）

Answer 1

您可以使用required属性来确保输入字段已填充。 您还可以使用min-length和max-length来确保输入的长度与您希望输入的所需长度相匹配。

例子：

<input type="text" required="required" min-length="4" max-length="4923" />

（这里用户必须输入一些长度在 4 到 4923 个字符之间的文本）

Answer 2

您可以使用

<input type="text" required>

或者

您可以简单地使用 javascript：

function checkRegisterData() {
if(password.value !== password2.value) {
alert('The first password does not match the second!')
}else
 {
  if(givenname.value == NULL)
  {
   alert("Name field Empty");
  }
 }
}