jQuery的表單驗證規則和警報

Question

我想在驗證過程中顯示警報，但沒有解決此問題，
我的代碼是：

$(document).ready(function(){
    $('#myform').validate({ 
        rules: {
            name: {
                required: true,
                digits: false
            },
            email: {
                required: true,
                email: true
            },
            pswd: {
                required: true,
                minlength: 5
            },
            cpswd: {
                required: true,
                equalTo: "#pswd"
            },
            agree: "required"
        },
        messages: {
            name: {
                required: "Enter Valid Name",
                digits: "Name contains characters only"
            },
            email: {
                required: "Enter Email",
                email: "Enter Valid Email (i.e. someone@example.com)"
            },
            pswd: {
                required: "Enter Valid Password",
                minlength: "Maximum allowed length is 5 Characters"
            },
            cpswd: "Password not Matched"
        },
        submitHandler: function(form) {
            var name = $("#name").val();
            var email = $("#email").val();
            var pswd =  $("#pswd").val();
            $("#submit").click(function() {
                alert("Data Submitted Successfully!\nName : "+ name +"\nEmail : "+ email +"\nPassword : "+ pswd);
                form.submit();
                return false;
            });
        }
    });
});

此代碼將錯誤顯示為文本消息。
我想在警報框中顯示錯誤。
在消息中，我發出警報，如：

 messages: {
          name: alert('Enter Name')
},

然后在頁面加載時顯示所有警報。

任何想法怎么辦？

Answer 1

您可以使用errorPlacement:選項。

First argument ：創建的錯誤標簽作為jQuery對象。

Second argument ：無效的元素，作為jQuery對象。

errorPlacement: function (error, element) {
        alert(error.text());
    }

注意：某些瀏覽器將陷入無限循環。

Answer 2

您可以像這樣：

$(document).ready(function () {
    $('#myform').validate({ 
        onclick: false,//add this to your code
        rules: {
            name: "required"
        },
        messages: {
            name: {
                required: "The Name is required!"
            }
        },
        errorPlacement: function (error, element) {
            alert(error.text());
        },
        submitHandler: function (form) { // for demo
            alert('valid form submitted'); // for demo
            return false; // for demo
        }
    });
});

工作JS FIDDLE