ajax的使用方法

后台在写代码时 一般都会用到AJAX传值的方法

了解的AJAX方法有三种样式

第一

$.ajax(
{
type: "POST",
url: "UserList.ashx?action=Del",
data: { FId: FId },
contentType: "application/x-www-form-urlencoded",
dataType: "json",
async: false,
cache: false,
success: function (data) {
debugger;
if (data.state) {
//提示并刷新页面
swal({
title: data.msg, //弹出框的title
type: "warning", //淡出框类型
showCancelButtun: false,//是否显示取消按钮
confirmButtonColor: "#DD6B55",//确定按钮颜色
confirmButtonText: "确定", //确定按钮上面的文档
closeOnConfirm: true,
timer: 1000,
},
function (isConfirm) {
window.location.href = data.url;
}
);

}
else {
swal({
title: data.msg, //弹出框的title
type: "warning", //淡出框类型
showCancelButtun: false,//是否显示取消按钮
confirmButtonColor: "#DD6B55",//确定按钮颜色
confirmButtonText: "确定", //确定按钮上面的文档
closeOnConfirm: true,
timer: 1000,
},
function (isConfirm) {
window.location.href = data.url;
}
);
}
},
error: function () {
swal({
title: "服务器异常", //弹出框的title
type: "waring", //弹出框类型
showCancelButton: false, //是否显示取消按钮
confirmButtonColor: "#DD6B55",//确定按钮上面的文档
closeOnConfirm: true

});
}

第二种  传递封装包

$.ajax(
{
type: "POST",
url: "SortList.ashx?action=Add",
data: imgData,
contentType: false,
dataType: "json",
processData: false,
async: false,
cache: false,
success: function (data) {
debugger;
if (data.state) {
//提示并刷新页面
swal({
title: data.msg, //弹出框的title
type: "success", //弹出框类型
showCancelButton: false,//是否显示取消按钮
timer: 1000,
}, function (isConfirm) {
window.location.href = data.url;
}
);

}
else {
swal({
title: data.msg, //弹出框的title
type: "warning", //淡出框类型
showCancelButtun: false,//是否显示取消按钮
confirmButtonColor: "#DD6B55",//确定按钮颜色
confirmButtonText: "确定", //确定按钮上面的文档
closeOnConfirm: true,
timer: 1000,
},
function (isConfirm) {
window.location.href = data.url;
}
);
}
},
error: function () {
swal({
title: "服务器异常", //弹出框的title
type: "waring", //弹出框类型
showCancelButton: false, //是否显示取消按钮
confirmButtonColor: "#DD6B55",//确定按钮上面的文档
closeOnConfirm: true

});
}
})

第三种  给前台传递图片信息

<script type="text/javascript">
$(function () {
//请求后台
$.ajax({
type: "POST",
url: " Products.aspx?action=NewImg",
data: {},
contentType: "application/x-www-form-urlencoded",
dataType: "json",
async: false,
cache: false,
success: function (data) {
if (data.state) {
//将data.data转换为JSON对象
var ImgList = JSON.parse(data.data);
console.log(ImgList);
//构造图片列表HTML
var imglist
for (var i = 0; i < ImgList.lenth; i++) {
imglist = imglist + '<div class="col-md-4"><div class="yc"><img src="' + ImgList[i].FImg + '" class="img-w-100" /></div ><p class="img-m--30">' + ImgList[i].FName + '</p></div >';
}
$("#imglist").html("");
$("#imglist").append(imglist);
}

}
});
})
</script>

第一种跟第二种的区别在于Data  传递后再次解析与不解析