JavaScript:表单:验证电子邮件地址并在发送前使用 Starts.With 检查另一个字段

Question

我是一个彻头彻尾的 JavaScript 菜鸟，但我已经搜索了很长一段时间的解决方案，但似乎找不到。

我想做的是:在发送form之前，检查输入的e-mail地址是否有效，同时检查phone字段的输入是否开始使用 http://。

验证电子邮件地址非常有效。但是，第二部分不是。 form 只是在没有任何 alert 或任何东西的情况下发送。

谁能教教我？谢谢!

function validate(){
    var email = document.getElementById('email').value;
    var phone = document.getElementById('phone').value;
    var filter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;

    if (!filter.test(email)) {
        alert('Please enter a valid e-mail address.');

        return false;
    }

    else if (phone.StartsWith("http://")) {
        alert('Please correct your phone number.');

        return false;
    }
}

对于任何疑惑的人:这应该是一个“简单的”垃圾邮件拦截器。

如果检查 phone 字段中除数字、加号、空格、连字符和点之外的任何字符，也许会更有趣...

你怎么看？

Answer 1

先回答你的问题:

---

编辑:现在 JavaScript 确实有 a startsWith function on the String object .

---

JavaScript 在 String 对象上没有 'StartsWith' 方法。为此，您将不得不使用正则表达式。这是一个例子:

function validate() {
    var email = document.getElementById('email').value;
    var phone = document.getElementById('phone').value;

    var emailFilter = /^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
    var phoneFilter = /^http:\/\//;

    if (!emailFilter.test(email)) {
        alert('Please enter a valid e-mail address.');
        return false;
    }

    if (!phoneFilter.test(phone)) {
        alert('Please correct your phone number.');
        return false;
    }

    return true;
}

我创建了一个 jsfiddle 来向您展示它是如何工作的:http://jsfiddle.net/cnVQe/1/

但是:最好使用声明式而不是编程式方法来验证表单。有很多工具可以做到这一点。其中之一是这个 jQuery 库，它为您完成了大部分繁重的 list :http://jqueryvalidation.org/

它的工作原理是将类添加到字段并让插件进行检查、错误显示和防止表单提交。

补充一下:你的方法并没有错，但是如果表单变大，你想检查更多的字段，你将不可避免地遇到其他人已经解决过的复杂问题。即使这意味着您使用额外的插件会带来额外的复杂性，一旦您开始使表单变大，这一切都是值得的。

此外:您的电子邮件地址检查正则表达式将不接受 + 符号，许多人使用它来创建特殊的 gmail 帐户，例如 john.doe+extraText@ gmail.com。使用诸如我描述的库之类的库通常已经进行了可靠的检查。因此，这是使用现有库的额外好处。