0

我的目标是让用户输入他的电子邮件，然后确认。如果两者不相同，则表单会显示错误。

下面的代码可以找到，除非用户

  • 在电子邮件字段中输入：“bla@stack.com”；
  • 在确认电子邮件字段中输入：“bla@stack.com”；
  • 返回电子邮件字段并将“bla@stack.com”更改为“azerty@stack.com”；
  • 不会更改确认电子邮件字段。

没有错误。

jQuery：

//Vérifie si l'email et sa répetition son identiques
$('#RepetitionEmail').keyup(function(){

    var RepetitionEmail = $('#RepetitionEmail').val();

    if($("#RepetitionEmail").val()!=$("#Email").val())
    {
        $('#RepetitionEmail').css('border-color','orange');
        $('.ErreurRepetitionEmail').text('Pas encore les mêmes ...');
        checkRepetitionEmail = "Repetition email pas identique";
    }else
    {
        $('#RepetitionEmail').css('border-color','#00ff00');
        $('.ErreurRepetitionEmail').text('... ça y est!');
        checkRepetitionEmail = "Repetition email ok";
    }
});
4

3 回答 3

5

将您的选择器更改为此

$('#RepetitionEmail, #Email').keyup(function(){

它现在将在两个输入上监听 keyUp 事件。

于 2012-07-26T12:02:06.080 回答
1

这个答案是正确的，您可以改进代码。首先，当用户仅使用鼠标粘贴文本时，您当前的代码将失败。其次，您有可以优化的冗余代码。

这是实现相同最终结果的更好方法：（假设您使用的是新的 jQuery 版本）

$("#MyForm").on("change", "#RepetitionEmail, #Email", function() {
    var tbEmail = $("#Email");
    var tbConfirmEmail = $("#RepetitionEmail");
    var email = tbEmail.val();
    var confirmEmail = tbConfirmEmail.val();
    if (email.length === 0 || confirmEmail.length === 0) {
        //user still did not fill up both.
        return;
    }

    var borderColor = "";
    var errorText = "";
    if(email !== confirmEmail)
    {
        borderColor = "orange";
        errorText = "Pas encore les mêmes ...";
        checkRepetitionEmail = "Repetition email pas identique";
    }else
    {
        borderColor = "#00ff00";
        errorText = "... ça y est!";
        checkRepetitionEmail = "Repetition email ok";
    }

    tbConfirmEmail.css('border-color', borderColor );
    $('.ErreurRepetitionEmail').text(errorText );
});

现场测试用例。

处理change事件会更好，因为无论文本如何更改，它都会起作用。

如果您有更多的东西要验证或希望它更灵活，请查看众多 jQuery 验证插件。

于 2012-07-26T12:16:21.470 回答
-1 
$('#RepetitionEmail, #Email').keyup(function(){ // do something }
于 2012-07-26T12:15:26.260 回答