如何使用JavaScript验证联系人表单？

我制作了一张联系表：

<form action="mailto:myemail@me.com" method="post" enctype="plain/text">
  <label for="name">Name:</label>&nbsp;<input type="text" name="name" />
  <label for="email">Email:</label>&nbsp;<input type="text" name="email" />
  <br clear="all" />
  <input type="submit" value="Compose" />
</form>

姓名：
电邮：

我想创建一个javascript表单验证程序，而不必使用像PHP这样的服务器端语言。有什么想法吗？

看看这个

$（'#form1'）。提交（函数（）{
//存储消息
var-msgs=[]；
//验证名称，至少需要4个字符。。。
变量名称=$（'[name=name]'，此）；
if（name.val（）.length<4）{
msgs.push（'-Name至少需要04个字符；'）；
}
//验证电子邮件[…]
//{CODE}
//验证其他内容[…]
//{CODE}
如果（msgs.length！==0）{
警报（“我们有一些问题：\n\n”+msgs.join（“\n”）；
返回false；
}
});​

小心不要把事情弄混了。您希望进行客户端验证，这很好，但不像服务器端验证那样需要，服务器端验证只能在服务器上进行

任何脚本kiddie仍然会设法将一些疯狂的数据发布到您的服务器，因此您必须检查您的请求并在服务器端清理数据

但是，如果您想在提交表单数据之前验证表单数据（这绝对是一个好标准），那么您应该使用众多可用jQuery插件中的一个，以获得最大的回报

这里有一个：

---

如果您不喜欢使用jQuery，则可以始终指定

onBlur=myFunction（）

在输入字段失去焦点时执行所需的任何逻辑

这是个坏主意。JavaScript和JavaScript验证可以通过多种方式绕过

用户可以告诉浏览器不要执行页面上的任何JavaScript。如果表单本身不依赖JavaScript，那么表单仍然会显示，操作页面仍然会显示，但所有验证都会消失

用户可以编辑DOM。Chrome、Firefox和IE中的网页开发工具使更改表单属性变得轻而易举。这包括从表单中删除诸如

onsubmit

之类的属性。或者，用户可以简单地从网页使用的资源中完全删除JavaScript函数。这允许用户避免进行验证

用户可以将

POST

或

GET

数据直接发送到操作URL，而无需浏览您的页面。这对攻击者来说是非常好的，因为他们甚至不需要通过浏览器就可以将格式错误的表单注入到服务器中——他们可以使用终端，这更方便

总之，不要这样做。允许用户控制验证是一件坏事。用户可以关闭客户端JavaScript，但不能关闭PHP服务器端验证。如果您不想遭受尴尬的跨站点脚本攻击和其他漏洞，请使用PHP验证

如果您正在寻找PHP表单验证库，您可以在Internet上找到很多。例如，我个人对在

POST

或

GET

类型表单中很好地评估字段做出了贡献。我为自我提升道歉，为了安全起见，我必须坚持您进行服务器端验证

---

这并不是说客户端验证很糟糕，永远不应该使用。但它应该总是通过服务器端验证进行备份。您应该将客户端验证视为一种在不重新加载的情况下通知用户其表单输入存在问题的方法，但始终使用服务器端验证来实际查看输入是否存在问题。

您可以使用jQuery对该方法进行验证。在

上返回
false
。提交（回调）

如果存在一些问题，例如无效的电子邮件。没有PHP？您可以使用ASP；-）对于电子邮件：请注意，JS验证只会鼓励用户输入正确的数据，但不会确保数据无论如何都是正确的（用户可以在其浏览器中禁用JavaScript，或者用户可能是黑客，故意将数据直接发送到服务器）@Tim我正试图避免使用任何服务器端编码，因为我的项目没有上传到数据库或任何东西。但我会试试ZiTAL的链接。因此，显然客户端验证不是一个好主意@David_Rodrigues感谢您的脚本，他们工作正常，但我忘了浏览器会阻止JavaScript（我将不得不走另一条路，做一些服务器端验证。哦，好吧。谢谢大家！这确实有助于学习情况。是的，这仍然是一个好主意。你只需要同时做这两件事（取决于你的要求）。这是任何替代方案都可以忽略的时候。

$('#form1').submit(function() {
    // Store messages
    var msgs = [];

    // Validate name, need at least 4 characters...
    var name = $('[name=name]', this);
    if(name.val().length < 4) {
        msgs.push('- Name need at least 04 characters;');
    }

    // Validate email [...]
    // {CODE}

    // Validate otherthings [...]
    // {CODE}

    if(msgs.length !== 0) {
        alert("We have some problems:\n\n" + msgs.join("\n"));
        return false;
    }
});​