Jquery电子邮件验证似乎被忽略

让用户输入一个电子邮件。如果无效;显示错误。如果这是一封有效的电子邮件，请将.wizard div向上滑动并显示消息“酷”！

截至目前我的代码（fiddle here）并没有削减它。它似乎没有将.error类添加到输入中，也没有显示.wizard div。我究竟做错了什么？另一组眼睛将非常感激。

$(".wizard").hide(); 
$("#signup").show(); 

$(".continue").click(function() { 
    var valid = true; 
    $("#" + $(this).attr("validationDiv")).find("input").each(function() { 
     if (!/^[email protected]+.S+$/.test($this).val()) valid = false; // if its not a valid email 
      ($this).addClass('error'); // show error 
      ($this).val('Please Insert a valid Email');   
    }); 
    if (valid) { // if it is valid 
     $(".wizard").slideUp(); // have this div show 
     $("#" + $(this).attr("data-next-id")).slideDown(); 
    } 
});

谢谢！

来源

2013-03-11 Modelesq

有什么不工作解决呢？在我的情况下，当输入一个非电子邮件地址和一个有效的电子邮件地址时，什么也没有发生 – kennypu 2013-03-11 03:51:30

对不起，没有解释。现在：错误消息（当它是一个不正确的电子邮件）和.wizard（显示它是一个正确的电子邮件）div不显示。我想知道为什么以及如何修复它。 :) – Modelesq 2013-03-11 03:54:01

在'validationDiv'中给出的id没有'signup'的div，虽然有一个'signUp' – 2013-03-11 03:57:20

貌似很多粗心犯错

$(".wizard").hide(); 
$("#signup").show(); 

$(".continue").click(function() { 
    var valid = true; 
    var that = this; 
    $("#" + $(this).attr("validationDiv")).find("input").each(function() { 
     var $this = $(this); 
       if (!/^[email protected]+.S+$/.test($(this).val())) 
        valid = false; 
       ($this).addClass('error'); 
       ($this).val('Please Insert a valid Email'); 
      }); 
    if (valid) { 
     $(".wizard").slideUp(); 
     $("#" + $(that).attr("data-next-id")).slideDown(); 
    } 
});

演示：Fiddle

问题我发现
1.没有元素的ID为signup，如validationDiv属性所示，所以添加id="signup"顶端DIV（class="sighUp"）
2.在您使用$this多次内回调，但它从来没有定义，由var $this = $(this);

来源

2013-03-11 04:01:21

当你真的应该滑动向导时，向上滑动向导。

来源

2013-03-11 03:56:53

第一件事情，你真的应该学习的jQuery和JavaScript之前...

$this应该$(this)。和你混在一起classed/id，再加上你不使用正确的元素名称。难怪它不工作。这里有一个修正的例子：http://jsfiddle.net/HvjtB/28/

现在你只需要创建一个正确的电子邮件检测正则表达式：http://www.regexper.com/

来源

2013-03-11 03:59:19

Jquery电子邮件验证似乎被忽略

回答

相关问题