3

在单击提交按钮并调用 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>
4

4 回答 4

5
<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>
于 2013-10-31T01:21:28.887 回答
2

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

网上很多,google一下就知道了。

示例正则表达式

于 2013-10-31T01:25:33.950 回答
1

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

  1. 现在,您问题中的代码以proceed() { ... }. 您应该更改它function proceed() { ... }以使其成为正确的函数声明
  2. 在使用它们的范围的顶部定义变量是一个好习惯。到目前为止,您已经将emailand problemsvars 声明为彼此相邻,这很好。然而,var noat它本身就是几行下来的。将其移至其他声明可帮助您的代码读者了解在此函数中要使用哪些变量
  3. 在函数的第四行,您检查是否email为空字符串。如果是,则设置problems变量。但如果它是空的,我们可以停在原地。您可以return problems;完成该功能。
  4. 它已经被指出,但是email.indexOf("@")使用原生 JS 方法来做你在字符串迭代器中所做的事情。
  5. for(int i=0; ...)我觉得这int i =0看起来很有趣,所以我尝试在浏览器的 javascript 控制台中输入它。我有一个错误。您可以将其更改for(var i = 0; ...)为正确的语法。
  6. 稍后在函数中,我们再次询问电子邮件是否为空:if(email == ""). 但是我们已经问过这个问题,如果它是真的,我们会退出这个函数。@如果字符串为空,我们不能在字符串中包含符号。
  7. 之前已经提到过,但您可能希望使用正则表达式来检查电子邮件。
  8. 接下来我们有noat = true. 这实际上将始终评估为 true,因为分配的结果是真实的。您将 的值设置noat为 true,而 javascript 就像“Cool Awesome 对我来说看起来不错”。它不检查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

于 2013-10-31T02:47:19.527 回答
1

好吧,我正要自己写这篇文章,但我碰巧在 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

于 2013-10-31T01:46:08.913 回答