jquery.validate 不用submit提交使用，button按钮提交前如何使用此插件验证

原创于 2013-03-27 16:18:29 发布 · 5k 阅读

3 ·

CC 4.0 BY-SA版权

JS 专栏收录该内容

59 篇文章

订阅专栏

本文介绍了一个使用jQuery进行表单验证并结合AJAX实现数据异步提交的例子。具体包括了验证产品名称和简介是否填写，并在验证通过后通过POST方式向服务器提交数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

	$("#addProductForm")
								.validate(
										{
											debug : true,
											rules : {
												proName : {
													required : true
												},
												proIntro : {
													required : true
												}
											},
											messages : {
												proName : {
													required : '<fmt:message key="exposition.product.encode.error.required" />'
												},
												proIntro : {
													required : '<fmt:message key="exposition.product.encode.error.required" />'

												}
											}
										});

						
						$("#saveExpoProduct").bind('click', function() {
							var flag = $("#addProductForm").valid();

							if (!flag) {
								//alert("没有通过验证");
								return;
							}
							//alert('saveExpoProduct click');
							$.ajax({
								url : "${saveExpoProduct }",
								type : "POST",
								dataType : "json",
								data : {
									eid : $("#eid").val(),
									eNo : $("#eNo").val(),
									proName : $("#proName").val(),
									proIntro : $("#proIntro").html(),
									picPath : $("#picPath").val()
								},
								success : function(data) {
									var obj = data;

									if (obj.status == 'SUCCESS') {
										alert("添加成功！");
									} else {
										alert("添加失败！");
									}
								},
								error : function(xhr) {
									// request error
									alert("request error!");
								}
							});

						});