0

我想做的是:

让用户输入电子邮件。如果无效;显示错误。如果它是有效的电子邮件,让.wizarddiv 向上滑动并显示一条消息“酷”!

截至目前,我的代码(这里的小提琴)没有削减它。它似乎没有将.error类添加到输入中,也没有.wizard显示 div 。我究竟做错了什么?另一双眼睛将不胜感激。

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

$(".continue").click(function () {
    var valid = true;
    $("#" + $(this).attr("validationDiv")).find("input").each(function () {
        if (!/^S+@S+.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();
     }
});

谢谢!

4

3 回答 3

1

首先,你真的应该在学习 jQuery 和 javascript 之前......

$this应该是$(this)。而你 mixup classed/id,加上你没有使用正确的元素名称。难怪它不起作用。这是一个更正的示例:http: //jsfiddle.net/HvjtB/28/

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

于 2013-03-11T03:59:19.977 回答
1

看起来有很多粗心的错误

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

$(".continue").click(function() {
    var valid = true;
    var that = this;
    $("#" + $(this).attr("validationDiv")).find("input").each(function() {
        var $this = $(this);
                if (!/^S+@S+.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();
    }
});

演示:小提琴

我发现的问题1.属性
中没有idsignup的元素,所以添加到顶部 div( ) 2. 内部回调中你使用了很多次,但从未定义过,解决方法validationDivid="signup"class="sighUp"
$thisvar $this = $(this);

于 2013-03-11T04:01:21.040 回答
0

当您确实应该向下滑动向导时,您正在向上滑动它。

于 2013-03-11T03:56:53.240 回答