Javascript 以良好可靠的方式验证表单输入

在我的页面上，有很多输入表单

我想在提交前检查用户输入

范例

HTML/PHP

<input type="text" name="adress" id="adress">
<input type="text" name="amount" id="amount">

实际上，我用Javascript做了以下工作

Javascript

function dataValidation() {
error=false;
var adress = document.getElementById('adress').value;
var amount = document.getElementById('adress').value;
if (adress == ""){
error=true;
}
if (amount >0 && amount < 999){
}
else {
error=true;
}
if (error == false){
document.forms["myForm"].submit();
}
}

函数数据验证（）{
错误=错误；
var address=document.getElementById（'address'）.value；
var金额=document.getElementById（'address'）。值；
如果（地址==“”）{
错误=真；
}
如果（金额>0&&金额<999）{
}
否则{
错误=真；
}
如果（错误==false）{
document.forms[“myForm”].submit（）；
}
}

所以，基本上这对我来说很好，但问题是，我必须为每个表单创建该函数，并为每个字段添加一个IF

所以，我在寻找更好的解决方案

想法1：添加一个列表，它提供输入类型，如

adress = not empty,
amount = >0 && <999,

address=不为空，
金额= > 0 & & P >如果你有多个相同字段的表单，试着在外部调用验证它会减少你的一些工作，除了我不知道任何其他方法，所以让其他人回复< /P> < P>你可能想考虑使用HTML5。
HTML5可以节省编写JS验证的时间。例如，要验证电子邮件地址，您可以使用以下内容：

<input type="email" name="email" required />



请注意type=“email”和required。您可以将HTML5表单属性与正则表达式模式结合使用，而不是使用js进行验证

例如，如果我想创建一个只接受一个数字和3个大写字母的输入字段，我可以使用正则表达式模式轻松地处理它：

<input type="text" pattern="[0-9][A-Z]{3}">



阅读更多关于HTML5和正则表达式的内容。它可以帮助您。
您可以通过jquery尝试以下操作：
您的html：

<input type="text" name="adress" id="adress">
<input type="text" name="amount" id="amount">
    <input type="button" id="check_input">

对于
地址
，您可以这样做
。有几十个或数百个javascript验证框架。Google for
javascript验证框架
这不是一个很好的答案-最好是作为对这个问题的评论。如果用户没有html-5浏览器会发生什么？它不支持。您可以使用此脚本在旧IE浏览器上启用HTML5API：我认为更好的方法是使用HTML5和服务器端验证（您必须使用这两种方法来确保安全性）。所有现代浏览器都支持HTML5，因此您的验证工作正常。如果用户使用不支持HTML5的浏览器，服务器端验证将抛出错误。我接受这个答案，因为它工作得很好。但我发现了一个基于jQuery的数据增值工具，名为“Parsely”
 $("#check_input").click(function() {
       $("input").each(function() {
          var element = $(this);
       if(element.val() == "") {
          element.css("border","1px solid red");
          element.attr("placeholder","Field is empty"); 
          return false;
          }

          });
          });