javascript - 验证后如何显示成功消息

我想验证某些字段，并想显示成功消息$（'。alert-success'）。show（）;用户输入所有值后。
我在这里尝试过jsfiddle现在我可以验证所有字段，但是如果所有字段都不为null，我不知道如何显示成功消息。
HTML：

<div class="contentContainer">
    <div class="alert alert-success hide">Form submitted successfully</div>
                        <div id="basicInfo">
                            <div class="toggleContentInnerSec">
                             <div class="row-fluid">
                                 <div class="span7">

                                 <label>First Name</label> <br>
                                 <p class="hide firstNameErrorMsg error">Please enter first name</p>
                                 <input type="text" name="borrowerBasicDetail.firstName" value="" id="addBorrowers_borrowerBasicDetail_firstName" class="access required" placeholder="Example: 'Sachin' " data-errormsg="firstNameErrorMsg"> <br>
                                 <label>Last Name</label> <br>
                                 <p class="hide lastNameErrorMsg error">Please enter last name</p>
                                 <input type="text" name="borrowerBasicDetail.lastName" value="" id="addBorrowers_borrowerBasicDetail_lastName" class="access required" placeholder="Example: 'Tendulkar' " data-errormsg="lastNameErrorMsg"> <br>
                                 <label>Date Of Birth</label> <br>
                                 <p class="hide birthDayErrorMsg error">Please enter date of birth</p>
                                 <input type="text" name="borrowerBasicDetail.age" value="" id="addBorrowers_borrowerBasicDetail_age" class="access required" placeholder="DD/MM/YYYY" data-errormsg="birthDayErrorMsg"> <br>

                             </div>
                         </div>

                         </div>
                        </div>

                        <div class="row-fluid pull-left">
                             <div class="form-actions">
                                <a class="btn btn-success btn-large" id="tabOneSubmit">Submit</a>
                             </div>
                        </div>

                    </div>

脚本：

submit();

function submit(){
    $('#tabOneSubmit').click(function(){
        $('.required').each(function(){
            var element=$(this);
            var elementVal=$(this).val();
            var errorMsgId=element.attr('data-errorMsg');
            if(elementVal==''){
                $('.'+errorMsgId).show();
                element.addClass('errorField');
            }
            else{
                $('.'+errorMsgId).hide();
                element.removeClass('errorField');
                }
        });

    });
}

最佳答案

这是解决方案，只需设置一个状态变量即可。

submit();

function submit(){
    $('#tabOneSubmit').click(function(){
        var status=true;
        $('.required').each(function(){

            var element=$(this);
            var elementVal=$(this).val();
            var errorMsgId=element.attr('data-errorMsg');
            if(elementVal==''){
                $('.'+errorMsgId).show();
                element.addClass('errorField');
                status=false;
            }
            else{
                $('.'+errorMsgId).hide();
                element.removeClass('errorField');
                }
        });

        if(status) {
            $('.alert-success').show();
        }

    });
}

Demo

关于javascript - 验证后如何显示成功消息，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18848810/