Jquery按键验证电子邮件输入

时间:2012-09-21 17:32:08

标签: javascript jquery regex jquery-validate

我想要完成的是:

如果用户输入有效的电子邮件,请显示(.check)'确定'标志。如果无效,则不显示任何内容(暂时。我稍后会放一些东西)。 我有3个电子邮件字段。我正试图为每一个'验证'。

<form id="emailsForm" method="POST" action="/account/recommend/">
    <div class="prepend">
        <p><strong>Emails:</strong></p>
        <div>
            <span class="added"><p class="check">ok</p></span>
            <input type="email" id="email1" class="input-text" onblur="alert(/([A-Z0-9a-z_-][^@])+?@[^$#<>?]+?\.[\w]{2,4}/.test(this.value))">
        </div>
        <div>
            <span class="added"><p class="check">ok</p></span>
            <input type="email" id="email2" class="input-text">
        </div>
        <div>
            <span class="added"><p class="check">ok</p></span>
            <input type="email" id="email3" class="input-text">
        </div>
        <button type="submit" class="submit">Send</button>
    </div>
</form>

$("form#emailsForm :input").each(function(){
    $('input').blur(function() {
        var testEmail = /^[A-Z0-9._%+-]+@([A-Z0-9-]+\.)+[A-Z]{2,4}$/i;
        if (testEmail.test(this.value)){
            $('input').siblings(".check").css('visibility', 'visible');
        }
        else {

        }
    });
});

http://jsfiddle.net/RFcaN/23/我做错了什么?

感谢您的帮助和建议!

1 个答案:

答案 0 :(得分:1)

首先,您需要找到this输入的兄弟,因此请将您的选择器从$('input')更改为$(this)

其次,.check不是输入的兄弟。它是兄弟姐妹的后裔。

$(this).siblings(".added").find('.check').css('visibility', 'visible');