此方法需要引入jquery.form.js 文件
前言
使用Form表单提交数据,并产生异步回调。
遇到一个ajaxForm不回调问题 --已解决
ajaxForm: 两个主要的API:ajaxForm() ajaxSubmit();
$("#form").ajaxForm(options);
使用ajaxForm并不是马上的提交,需要执行submit()
$("#form").ajaxForm(options).submit();
并且,ajaxForm提交方式,不会自动调用success\error\beforeSubmit 等回调方法。
如果需要使用自动回调的方式,可以使用ajaxSubmit 的方式发起提交。
var options={
url:url, //form提交数据的地址
type:action, //form提交的方式(method:post/get)
dataType:"json", //服务器返回数据类型
clearForm:false, //提交成功后是否清空表单中的字段值
restForm:false, //提交成功后是否重置表单中的字段值,即恢复到页面加载时的状态
// target:target, //服务器返回的响应数据显示在元素(Id)号确定
// beforeSubmit:function(), //提交前执行的回调函数
success:function(data,statusText){//提交成功后执行的回调函数
if (data && data.code == "0") {
location.href = ActionUrl + "sellerjump/toMyShop";
}else {
alert(data.codeMsg);// 提示
}
},
error:function(data){//提交失败后执行的回调函数
alert("网络异常");
},
timeout:6000 //设置请求时间,超过该时间后,自动退出请求,单位(毫秒)。
};
这里提供一个Form表单验证方式
html:{
<input type="text" name="shopName" class="weui-input" placeholder="请输入店铺名称"/>
shopName等字段为html代码中input标签的name属性值
}
var form = document.getElementById("form");
// 表单验证
with (form) {
if (validate_required(shopName,"店铺名称不能为空!")==false) {
return false
}
if (validate_required(shopProfile,"店铺简介不能为空!")==false) {
return false
}
if (validate_required(telephone,"联系电话不能为空!")==false) {
return false
}
if (validate_required(shopAddress,"店铺地址不能为空!")==false) {
return false
}
if (validate_required(shopLng,"店铺地址位置错误!")==false) {
return false
}
if (validate_required(shopLat,"店铺地址位置错误!")==false) {
return false
}
if (validate_required(shopImage,"店铺图片不能为空!")==false) {
return false
}
}
// 表单验证
function validate_required(field,alerttxt) {
with (field) {
if (!field.value) {
$.toptip(alerttxt, 'warning');
return false
}else {
return true
}
}
}