Question

我正在尝试在点击提交按钮并调用js函数后验证输入文本是否具有电子邮件格式。我遇到的第一个问题是经过一些测试，我发现它没有进入被调用的函数。在此之后，我认为一切都应该没问题，但为了防止在几分钟内发出2个几乎相同的问题，生病包括最重要的部分。总结一下，它应该检查： - 电子邮件字段不为空 - 电子邮件字段有@（不考虑订单等）

然后它应该告诉它是否发现任何问题，如果没有保持一切不变

我希望我提出我的观点，如果不是我可以尝试再解释一下......

 <input type="text" name="email" id="email">
    <input type="submit"  onclick=" proceed()"/>
<script>
    proceed(){
                        var email= document.getElementById('email').value;
                        var problems;
                        if (email == ""){
                            problems = "Empty variable \n";

                        }

                        var noat = true;
                        for (int i=0; email.length; i++){
                            if (email.charAt(i) == "@"){  //Compare each character
                               noat=false;
                               break;
                            }
                        }

                        if (email=="" || noat=true){
                            problems += "No @ \n"
                            alert(problems);                        
                        }
    }

</script>

Answer 1

<form onsubmit="return proceed();">
    <input type="text" name="email" id="email">
    <input type="submit" />
</form>

<script>
    function proceed() {
        var email = document.getElementById('email').value;
        var problems = "";

        if (email == "") {
            problems = "Empty variable \n";
        }

        var noat = false;
        if (email.indexOf("@") == -1) noat = true;

        //    for (int i=0; i< email.length; i++){
        //    if (email.charAt(i) == "@"){  //Compare each character
        //       noat=false;
        //       break;
        //}

        if (email == "" || noat == true) {
            problems += "No @ \n";
            alert(problems);
        }

        if (problems == "")
            return true;
        else
            return false;
    }
</script>

Answer 2

我认为你不应该使用onclick，而应该使用onsubmit而不是比较@符号的每个字符，你应该使用电子邮件测试正则表达式。

网上有很多人，只是google。

sample regular expressions

Answer 3

我自己就是要写这个，但我碰巧在4个小时前发现了它。这对你有帮助。

<script>
function proceed()
{
var email = document.getElementById("email").value;
var atpos = email.indexOf("@");
var dotpos = email.lastIndexOf(".");
if (atpos < 1 || dotpos < atpos+2 || dotpos+2 >= email.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }
};
</script>

<form onsubmit="proceed();">
    <input type="text" name="email" id="email" />
    <input type="submit" />
</form>

你的代码有很多错别字，只是在写作时花点时间。这来自w3schools

Answer 4

这个问题已被标记为已回答，但我觉得这个问题有一些关键的要点/学习点，所以我在下面添加了我的输入，fwiw。

现在，问题中的代码以proceed() { ... }开头。您应该将其更改为function proceed() { ... }以使其成为正确的函数声明
将变量定义在使用它们的范围顶部是一个好习惯。截至目前，您已将email和problems vars声明为彼此相邻，这很好。但是，var noat本身就是几行。将其移至其他声明有助于您的代码的读者了解在此函数中使用哪些变量
在函数的第四行，检查email是否为空字符串。如果是，则设置problems变量。但如果它是空的，我们可以停在原地。您只需return problems;即可完成该功能。
已经指出了，但是email.indexOf("@")使用本机JS方法来执行你在字符串迭代器中所做的事情。
for(int i=0; ...)我认为int i =0看起来很有趣，所以我尝试在浏览器的javascript控制台中输入它。我收到了一个错误。您可以将其更改为for(var i = 0; ...)以获取正确的语法。
稍后在函数中我们询问电子邮件是否再次为空：if(email == "")。但是我们已经问过这个问题了，如果它是真的，它会退出这个功能。如果字符串为空，我们在字符串中不能有@符号。
之前已经提到过，但您可能希望使用正则表达式来检查电子邮件。
接下来我们有noat = true。这实际上总是评估为真，因为赋值的结果是真实的。你将noat的值设置为true，javascript就像“酷酷的看起来对我好”。它不会检查noat最初是设置为true还是false。

我已经创建并测试了一个遵循大部分建议的jsfiddle。它还展示了一种使代码更简洁并实现类似目标的方法。对不起，如果因为过于讲道/知道所有这一切，我绝对不会。这个问题引起了我的兴趣，我不得不回应！

window.proceed = function () {
    var email = document.getElementById('email').value;
    if (email == "") {
        alert("Empty variable \n");
    } else if (email.indexOf("@") == -1) {
        alert("No @ \n");
    } else return true; 
}

jsfiddle

提交按钮上的onclick事件

4 个答案: