2023年6月21日发(作者:)

jquery验证插件①:引⼊js类库以及样式 ②:为表单添加验证的样式(通过注册表单说明下有哪些验证)

*⽤户名:

6-20个字符,允许英⽂字母、数字、下划线.

*密码:

请选⽤安全的密码

*确认密码:
*电⼦邮箱:
住址:
⼿机:
*验证码: 看不清。换⼀个

注册条款
说明:⽤ 户 名————验证⾮空,长度在6到20之间,通过ajaxUserName验证⽤户名唯⼀ 密 码————验证⾮空,长度在6到20之间 确认密码————验证⾮空,必须和密码填写内容⼀致 邮 箱————⾮空且为正确的邮箱格式 验 证 码————⾮空,ajax验证验证码是否正确 注册条款————⾮空这⾥附上tiongEngine-zh_代码(function($){ $.tionEngineLanguage = function(){ }; $.validationEngineLanguage = { newLang: function(){ $.es = { "required": { // Add your regex rules here, you can take telephone as an example "regex": "none", "alertText": "* 此处不可空⽩", "alertTextCheckboxMultiple": "* 请选择⼀个项⽬", "alertTextCheckboxe": "* 您必须勾选此栏", "alertTextDateRange": "* ⽇期范围不可空⽩" }, "requiredInFunction": {

"func": function(field, rules, i, options){ return (() == "test") ? true : false; }, "alertText": "* Field must equal test" }, "dateRange": { "regex": "none", "alertText": "* ⽆效的 ", "alertText2": " ⽇期范围" }, "dateTimeRange": { "regex": "none", "alertText": "* ⽆效的 ", "alertText2": " 时间范围" }, "minSize": { "regex": "none", "alertText": "* 最少 ", "alertText2": " 个字符" }, "maxSize": { "regex": "none", "alertText": "* 最多 ", "alertText2": " 个字符" }, "groupRequired": { "regex": "none", "alertText": "* 你必需选填其中⼀个栏位" }, "min": { "regex": "none", "alertText": "* 最⼩值為 " }, "max": { "regex": "none", "regex": "none", "alertText": "* 最⼤值为 " }, "past": { "regex": "none", "alertText": "* ⽇期必需早于 " }, "future": { "regex": "none", "alertText": "* ⽇期必需晚于 " },

"maxCheckbox": { "regex": "none", "alertText": "* 最多选取 ", "alertText2": " 个项⽬" }, "minCheckbox": { "regex": "none", "alertText": "* 请选择 ", "alertText2": " 个项⽬" }, "equals": { "regex": "none", "alertText": "* 请输⼊与上⾯相同的密码" }, "creditCard": { "regex": "none", "alertText": "* ⽆效的信⽤卡号码" }, "phone": { // credit: / orefalo "regex": /^([+][0-9]{1,3}[ .-])?([(]{1}[0-9]{2,6}[)])?([0-9 .-]{3,20})((x|ext|extension)[ ]?[0-9]{1,4})?$/, "alertText": "* ⽆效的电话号码" }, "mobile":{ "regex":/^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+d{8})$/, "alertText":"* ⽆效⼿机号" }, "email": { // Shamelessly lifted from Scott Gonzalez via the Bassistance Validation plugin /email_address_validation/ //regex":/^[a-zA-Z0-9_.]{1,}@[a-zA-Z0-9_]{1,}.[a-zA-Z0-9_]{1,}|.[a-zA-z0-9_]{1,}$/, "alertText": "* 邮件地址需由字母、数字或下划线组成" }, "integer": { "regex": /^[-+]?d+$/, "alertText": "* 不是有效的整数" }, "number": { // Number, including positive, negative, and floating decimal. credit: orefalo "regex": /^[-+]?((([0-9]{1,3})([,][0-9]{3})*)|([0-9]+))?([.]([0-9]+))?$/, "alertText": "* ⽆效的数字" }, "post":{ "regex":/^[1-9][0-9]{5}$/, "alertText":"* ⽆效邮政编码,6位数字,不能以0开头" }, "date": { "regex": /^d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])$/, "alertText": "* ⽆效的⽇期,格式必需为 YYYY-MM-DD" }, "ipv4": { "regex": /^((([01]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))[.]){3}(([0-1]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))$/, "alertText": "* ⽆效的 IP 地址" }, "url": { "regex": /^((([a-z]|d|[!#$%&'*+-=?^_`{|}~])+(.([a-z]|d|[!#$%&'*+-=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])+)*)|((x22)(((( "url": { "alertText": "* Invalid URL" }, "onlyNumberSp": { "regex": /^[0-9 ]+$/, "alertText": "* 只能填数字" }, "onlyLetterSp": { "regex": /^[a-zA-Z ']+$/, "alertText": "* 只接受英⽂字母⼤⼩写" }, "onlyLetterNumber": { "regex": /^[0-9a-zA-Z_]+$/, "alertText": "* 允许英⽂字母、数字、下划线" }, // --- CUSTOM RULES -- Those are specific to the demos, they can be removed or changed to your likings "ajaxUserCall": { "url": "ajaxValidateFieldUser", // you may want to pass extra data on the ajax call "extraData": "name=eric", "alertText": "* 此名称已被其他⼈使⽤", "alertTextLoad": "* 正在确认名称是否有其他⼈使⽤,请稍等。" }, "ajaxUserCallPhp": { "url": "phpajax/", // you may want to pass extra data on the ajax call "extraData": "name=eric", // if you provide an "alertTextOk", it will show as a green prompt when the field validates "alertTextOk": "* 此帐号名称可以使⽤", "alertText": "* 此名称已被其他⼈使⽤", "alertTextLoad": "* 正在确认帐号名称是否有其他⼈使⽤,请稍等。" }, "ajaxNameCall": { // remote json service location "url": "ajaxValidateFieldName", // error "alertText": "* 此名称可以使⽤", // if you provide an "alertTextOk", it will show as a green prompt when the field validates "alertTextOk": "* 此名称已被其他⼈使⽤", // speaks by itself "alertTextLoad": "* 正在确认名称是否有其他⼈使⽤,请稍等。" }, "ajaxNameCallPhp": { // remote json service location "url": "phpajax/", // error "alertText": "* 此名称已被其他⼈使⽤", // speaks by itself "alertTextLoad": "* 正在确认名称是否有其他⼈使⽤,请稍等。" }, "validate2fields": { "alertText": "* 请输⼊ HELLO" }, //tls warning:homegrown not fielded

"dateFormat":{ "alertText": "* ⽆效的⽇期格式" }, //tls warning:homegrown not fielded

"dateTimeFormat": { "alertText": "* ⽆效的⽇期或时间格式", "alertText2": "可接受的格式: ", "alertText3": "mm/dd/yyyy hh:mm:ss AM|PM 或 ",

"alertText4": "yyyy-mm-dd hh:mm:ss AM|PM" "regex": /^(https?|ftp):(((([a-z]|d|-|.|_|~|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(%[da-f]{2})|[!$&'()*+,;=]|:)*@)?(((d|[1-9]d|1dd|2[0- "regex": /^d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])$|^(?:(?:(?:0?[13578]|1[02])(|-)31)|(?:(?:0?[1,3-9]|1[0-2])(|-)(?:29|30)))(|-)(?:[1-9]d "regex": /^d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])s+(1[012]|0?[1-9]){1}:(0?[1-5]|[0-6][0-9]){1}:(0?[0-6]|[0-6][0-9]){1}s+(am|pm|AM|PM){1}$ "alertText4": "yyyy-mm-dd hh:mm:ss AM|PM" }, "ajaxUserNo":{ "url": "customer_", "alertText": "* 此帐号已被其他⼈使⽤", "alertTextLoad": "* 验证帐号是否可⽤,请稍等...", "alertTextOk": "此帐号可以使⽤" }, "ajaxUserName":{ "url": "customer_", "alertText": "* ⽤户姓名已被其他⼈使⽤", "alertTextLoad": "* 验证⽤户姓名是否可⽤,请稍候..." }, "ajaxUserEmail":{ "url": "users_valid_user_", "alertText": "* 此邮箱已被其他⼈使⽤", "alertTextLoad": "* 验证邮箱是否已被使⽤,请稍等..." }, "ajaxVerifyCode":{ "url": "customer_", "alertText": "* 验证码输⼊不正确", "alertTextLoad": "* 匹配验证码中,请稍等..." } };

} }; $.g();})(jQuery);在这个js⽂件⾥⾯可以⾃⼰定义验证的ajax⽅法,如:ajaxUserEmail,ajaxVerifyCode,ajaxUserName等等③:页⾯加载完成后,初始化插件jQuery(document).ready(function(){ $("#signup_form").validationEngine({promptPosition: "topRight"}); });④:action: /** * 验证⽤户账号是否已经存在 *

* @return */ public String validUserName() { PrintWriter out = null; JSONArray json = new JSONArray(); try { HttpServletResponse response = ponse(); HttpServletRequest request = (HttpServletRequest) ActionContext .getContext().get(_REQUEST); racterEncoding("UTF-8"); out = ter(); String validateId = ameter("fieldId"); String validateValue = ameter("fieldValue"); // 注意下⾯的顺序,感觉这是个缺陷之⼀,不过可以在更改, (validateId); boolean unique = ue(validateValue); if (!unique) { (false); } else { (true); } (ng()); } catch (Exception e) { tackTrace(); } finally { if (null != out) { (); (); } } return null; }ajax验证验证码 /** * Desc ajax验证验证码 *

* @author:dongliyuan * @date:2014-11-4 上午10:35:00 * @return * @throws Exception */ @SuppressWarnings("unchecked") public String validateCode() throws Exception { PrintWriter out = null; JSONArray json = new JSONArray(); try { Map session = text().getSession(); HttpServletRequest request = (HttpServletRequest) ActionContext .getContext().get(_REQUEST); HttpServletResponse response = ponse(); racterEncoding("UTF-8"); out = ter(); String validateId = ameter("fieldId"); String validateValue = ameter("fieldValue"); // 注意下⾯的顺序,感觉这是个缺陷之⼀,不过可以在更改, (validateId); if (("validateCode").equals( (validateValue, "UTF-8").trim())) { (true); } else { (false); } (ng()); } catch (Exception e) { tackTrace(); } finally { if (null != out) { (); (); } } return null; }action配置就不写了

2023年6月21日发(作者:)

jquery验证插件①:引⼊js类库以及样式 ②:为表单添加验证的样式(通过注册表单说明下有哪些验证)

*⽤户名:

6-20个字符,允许英⽂字母、数字、下划线.

*密码:

请选⽤安全的密码

*确认密码:
*电⼦邮箱:
住址:
⼿机:
*验证码: 看不清。换⼀个

注册条款
说明:⽤ 户 名————验证⾮空,长度在6到20之间,通过ajaxUserName验证⽤户名唯⼀ 密 码————验证⾮空,长度在6到20之间 确认密码————验证⾮空,必须和密码填写内容⼀致 邮 箱————⾮空且为正确的邮箱格式 验 证 码————⾮空,ajax验证验证码是否正确 注册条款————⾮空这⾥附上tiongEngine-zh_代码(function($){ $.tionEngineLanguage = function(){ }; $.validationEngineLanguage = { newLang: function(){ $.es = { "required": { // Add your regex rules here, you can take telephone as an example "regex": "none", "alertText": "* 此处不可空⽩", "alertTextCheckboxMultiple": "* 请选择⼀个项⽬", "alertTextCheckboxe": "* 您必须勾选此栏", "alertTextDateRange": "* ⽇期范围不可空⽩" }, "requiredInFunction": {

"func": function(field, rules, i, options){ return (() == "test") ? true : false; }, "alertText": "* Field must equal test" }, "dateRange": { "regex": "none", "alertText": "* ⽆效的 ", "alertText2": " ⽇期范围" }, "dateTimeRange": { "regex": "none", "alertText": "* ⽆效的 ", "alertText2": " 时间范围" }, "minSize": { "regex": "none", "alertText": "* 最少 ", "alertText2": " 个字符" }, "maxSize": { "regex": "none", "alertText": "* 最多 ", "alertText2": " 个字符" }, "groupRequired": { "regex": "none", "alertText": "* 你必需选填其中⼀个栏位" }, "min": { "regex": "none", "alertText": "* 最⼩值為 " }, "max": { "regex": "none", "regex": "none", "alertText": "* 最⼤值为 " }, "past": { "regex": "none", "alertText": "* ⽇期必需早于 " }, "future": { "regex": "none", "alertText": "* ⽇期必需晚于 " },

"maxCheckbox": { "regex": "none", "alertText": "* 最多选取 ", "alertText2": " 个项⽬" }, "minCheckbox": { "regex": "none", "alertText": "* 请选择 ", "alertText2": " 个项⽬" }, "equals": { "regex": "none", "alertText": "* 请输⼊与上⾯相同的密码" }, "creditCard": { "regex": "none", "alertText": "* ⽆效的信⽤卡号码" }, "phone": { // credit: / orefalo "regex": /^([+][0-9]{1,3}[ .-])?([(]{1}[0-9]{2,6}[)])?([0-9 .-]{3,20})((x|ext|extension)[ ]?[0-9]{1,4})?$/, "alertText": "* ⽆效的电话号码" }, "mobile":{ "regex":/^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1}))+d{8})$/, "alertText":"* ⽆效⼿机号" }, "email": { // Shamelessly lifted from Scott Gonzalez via the Bassistance Validation plugin /email_address_validation/ //regex":/^[a-zA-Z0-9_.]{1,}@[a-zA-Z0-9_]{1,}.[a-zA-Z0-9_]{1,}|.[a-zA-z0-9_]{1,}$/, "alertText": "* 邮件地址需由字母、数字或下划线组成" }, "integer": { "regex": /^[-+]?d+$/, "alertText": "* 不是有效的整数" }, "number": { // Number, including positive, negative, and floating decimal. credit: orefalo "regex": /^[-+]?((([0-9]{1,3})([,][0-9]{3})*)|([0-9]+))?([.]([0-9]+))?$/, "alertText": "* ⽆效的数字" }, "post":{ "regex":/^[1-9][0-9]{5}$/, "alertText":"* ⽆效邮政编码,6位数字,不能以0开头" }, "date": { "regex": /^d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])$/, "alertText": "* ⽆效的⽇期,格式必需为 YYYY-MM-DD" }, "ipv4": { "regex": /^((([01]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))[.]){3}(([0-1]?[0-9]{1,2})|(2[0-4][0-9])|(25[0-5]))$/, "alertText": "* ⽆效的 IP 地址" }, "url": { "regex": /^((([a-z]|d|[!#$%&'*+-=?^_`{|}~])+(.([a-z]|d|[!#$%&'*+-=?^_`{|}~]|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])+)*)|((x22)(((( "url": { "alertText": "* Invalid URL" }, "onlyNumberSp": { "regex": /^[0-9 ]+$/, "alertText": "* 只能填数字" }, "onlyLetterSp": { "regex": /^[a-zA-Z ']+$/, "alertText": "* 只接受英⽂字母⼤⼩写" }, "onlyLetterNumber": { "regex": /^[0-9a-zA-Z_]+$/, "alertText": "* 允许英⽂字母、数字、下划线" }, // --- CUSTOM RULES -- Those are specific to the demos, they can be removed or changed to your likings "ajaxUserCall": { "url": "ajaxValidateFieldUser", // you may want to pass extra data on the ajax call "extraData": "name=eric", "alertText": "* 此名称已被其他⼈使⽤", "alertTextLoad": "* 正在确认名称是否有其他⼈使⽤,请稍等。" }, "ajaxUserCallPhp": { "url": "phpajax/", // you may want to pass extra data on the ajax call "extraData": "name=eric", // if you provide an "alertTextOk", it will show as a green prompt when the field validates "alertTextOk": "* 此帐号名称可以使⽤", "alertText": "* 此名称已被其他⼈使⽤", "alertTextLoad": "* 正在确认帐号名称是否有其他⼈使⽤,请稍等。" }, "ajaxNameCall": { // remote json service location "url": "ajaxValidateFieldName", // error "alertText": "* 此名称可以使⽤", // if you provide an "alertTextOk", it will show as a green prompt when the field validates "alertTextOk": "* 此名称已被其他⼈使⽤", // speaks by itself "alertTextLoad": "* 正在确认名称是否有其他⼈使⽤,请稍等。" }, "ajaxNameCallPhp": { // remote json service location "url": "phpajax/", // error "alertText": "* 此名称已被其他⼈使⽤", // speaks by itself "alertTextLoad": "* 正在确认名称是否有其他⼈使⽤,请稍等。" }, "validate2fields": { "alertText": "* 请输⼊ HELLO" }, //tls warning:homegrown not fielded

"dateFormat":{ "alertText": "* ⽆效的⽇期格式" }, //tls warning:homegrown not fielded

"dateTimeFormat": { "alertText": "* ⽆效的⽇期或时间格式", "alertText2": "可接受的格式: ", "alertText3": "mm/dd/yyyy hh:mm:ss AM|PM 或 ",

"alertText4": "yyyy-mm-dd hh:mm:ss AM|PM" "regex": /^(https?|ftp):(((([a-z]|d|-|.|_|~|[u00A0-uD7FFuF900-uFDCFuFDF0-uFFEF])|(%[da-f]{2})|[!$&'()*+,;=]|:)*@)?(((d|[1-9]d|1dd|2[0- "regex": /^d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])$|^(?:(?:(?:0?[13578]|1[02])(|-)31)|(?:(?:0?[1,3-9]|1[0-2])(|-)(?:29|30)))(|-)(?:[1-9]d "regex": /^d{4}[-](0?[1-9]|1[012])[-](0?[1-9]|[12][0-9]|3[01])s+(1[012]|0?[1-9]){1}:(0?[1-5]|[0-6][0-9]){1}:(0?[0-6]|[0-6][0-9]){1}s+(am|pm|AM|PM){1}$ "alertText4": "yyyy-mm-dd hh:mm:ss AM|PM" }, "ajaxUserNo":{ "url": "customer_", "alertText": "* 此帐号已被其他⼈使⽤", "alertTextLoad": "* 验证帐号是否可⽤,请稍等...", "alertTextOk": "此帐号可以使⽤" }, "ajaxUserName":{ "url": "customer_", "alertText": "* ⽤户姓名已被其他⼈使⽤", "alertTextLoad": "* 验证⽤户姓名是否可⽤,请稍候..." }, "ajaxUserEmail":{ "url": "users_valid_user_", "alertText": "* 此邮箱已被其他⼈使⽤", "alertTextLoad": "* 验证邮箱是否已被使⽤,请稍等..." }, "ajaxVerifyCode":{ "url": "customer_", "alertText": "* 验证码输⼊不正确", "alertTextLoad": "* 匹配验证码中,请稍等..." } };

} }; $.g();})(jQuery);在这个js⽂件⾥⾯可以⾃⼰定义验证的ajax⽅法,如:ajaxUserEmail,ajaxVerifyCode,ajaxUserName等等③:页⾯加载完成后,初始化插件jQuery(document).ready(function(){ $("#signup_form").validationEngine({promptPosition: "topRight"}); });④:action: /** * 验证⽤户账号是否已经存在 *

* @return */ public String validUserName() { PrintWriter out = null; JSONArray json = new JSONArray(); try { HttpServletResponse response = ponse(); HttpServletRequest request = (HttpServletRequest) ActionContext .getContext().get(_REQUEST); racterEncoding("UTF-8"); out = ter(); String validateId = ameter("fieldId"); String validateValue = ameter("fieldValue"); // 注意下⾯的顺序,感觉这是个缺陷之⼀,不过可以在更改, (validateId); boolean unique = ue(validateValue); if (!unique) { (false); } else { (true); } (ng()); } catch (Exception e) { tackTrace(); } finally { if (null != out) { (); (); } } return null; }ajax验证验证码 /** * Desc ajax验证验证码 *

* @author:dongliyuan * @date:2014-11-4 上午10:35:00 * @return * @throws Exception */ @SuppressWarnings("unchecked") public String validateCode() throws Exception { PrintWriter out = null; JSONArray json = new JSONArray(); try { Map session = text().getSession(); HttpServletRequest request = (HttpServletRequest) ActionContext .getContext().get(_REQUEST); HttpServletResponse response = ponse(); racterEncoding("UTF-8"); out = ter(); String validateId = ameter("fieldId"); String validateValue = ameter("fieldValue"); // 注意下⾯的顺序,感觉这是个缺陷之⼀,不过可以在更改, (validateId); if (("validateCode").equals( (validateValue, "UTF-8").trim())) { (true); } else { (false); } (ng()); } catch (Exception e) { tackTrace(); } finally { if (null != out) { (); (); } } return null; }action配置就不写了