Question

我正在构建一个分解为幻灯片的表单。我希望这样做，以便当用户单击箭头移动到下一张幻灯片时，表单首先验证他/她输入的信息是否对输入字段有效。如果是这样，它会继续前进，如果没有，它会以一些视觉效果提醒使用。

这是代码

    $('.next').click(function() {
    if(indexBG === 3){
        indexBG = 3;
        $('#RF'+indexBG).css('display', 'block');
        $('#RF'+indexBG).fadeOut(500);
        $('#RF'+indexBG).fadeIn(500);
     }
     else {
           validateIt();
     }
     function validateIt() {
           if(!isValidEmailAddress($('#email-reg-input').val())) {
                $('#email-reg-input').css("border","red solid thin");
            }   
            else {
                  $('#RG1').css('background-color','green');
                  $('#RG1').html('33% Complete!');
            }
            if($('#name-reg-input').val() == ''){
                  $('#name-reg-input').css("border","red solid thin");
             }
             else {
                  $('#name-reg-input').css("border","green solid thin");  
             }
     };
     });

Answer 1

表单验证可能会非常棘手。特别是当你考虑所有不同的用例和垃圾用户的变种可以进入。因此，既然您已经在使用jQuery，那么您可能需要查看jQuery Validation Plugin。

如何在转到下一张幻灯片之前验证表单字段

1 个答案: