我想进行纯前端的校验,就是用了这样的方法,虽然在验证失败后能够将name属性对应标签的错误展示出来,但是错误信息不能够具体,不灵活,例如上面的例子,只要用户名空,长度不符合规范的时候都是显示的同一句错误信息,我现在想将不同的错误信息展示出来应该怎么做?就是说用户名是空值就说是用户名不能为空。长度错误就说用户名长度不符合规范这样的。求大神指导
$.validator.setDefaults({ submitHandler: function() { alert("submitted!"); } }); $().ready(function() { // validate the comment form when it is submitted $("#commentForm").validate(); // validate signup form on keyup and submit $("#signupForm").validate({ rules: { firstname: "required", lastname: "required", username: { required: true, minlength: 2 }, password: { required: true, minlength: 5 }, confirm_password: { required: true, minlength: 5, equalTo: "#password" }, email: { required: true, email: true }, topic: { required: "#newsletter:checked", minlength: 2 }, agree: "required" }, messages: { firstname: "Please enter your firstname", lastname: "Please enter your lastname", username: { required: "Please enter a username", minlength: "Your username must consist of at least 2 characters" }, password: { required: "Please provide a password", minlength: "Your password must be at least 5 characters long" }, confirm_password: { required: "Please provide a password", minlength: "Your password must be at least 5 characters long", equalTo: "Please enter the same password as above" }, email: "Please enter a valid email address", agree: "Please accept our policy" } }); // propose username by combining first- and lastname $("#username").focus(function() { var firstname = $("#firstname").val(); var lastname = $("#lastname").val(); if(firstname && lastname && !this.value) { this.value = firstname + "." + lastname; } }); //code to hide topic selection, disable for demo var newsletter = $("#newsletter"); // newsletter topics are optional, hide at first var inital = newsletter.is(":checked"); var topics = $("#newsletter_topics")[inital ? "removeClass" : "addClass"]("gray"); var topicInputs = topics.find("input").attr("disabled", !inital); // show when newsletter is checked newsletter.click(function() { topics[this.checked ? "removeClass" : "addClass"]("gray"); topicInputs.attr("disabled", !this.checked); }); });
非常感谢啊
分开各个判断,判断是空的时候就提示空的说明,判断是长度的时候就提示长度的说明
具体怎么写代码~~~