jQuery发起get/post请求_或_获取html页面数据
备注:我们经常会遇到使用jQuery获取某个地址下的部分页面内容,然后替换当前页面对应内容,也就是:局部刷新功能。
当然也可以使用get/post请求获取数据,修改数据,可以参考以下JS代码:
// Ajax模拟类
var Ajax = function () {
//一般处理程序名称
this.handlerName = "";
//方法名称
this.actionName = "";
//传入的参数对象
this.data = {};
//回调函数
this.rollBack = function (result) { };
this.Init = function (handlerName, actionName, dataObject, rollBack) {
this.handlerName = handlerName;
this.actionName = actionName;
this.data = dataObject;
this.rollBack = rollBack;
return this;
};
//Get请求
this.Get = function () {
$.ajax({
type: "GET",
url: "/ajax/" + this.handlerName + ".js?action=" + this.actionName,
data: this.data,
async: true,//false代表只有在等待ajax执行完毕后才执行
success: function (json) {
try {
result = JSON.parse(json);
} catch (e) {
result = new Function("return " + json)();
}
if (window.Ajax.rollBack && window.Ajax.rollBack instanceof Function) {
window.Ajax.rollBack(result);
}
},
error: function (e) {
console.log(e);
}
});
};
//获取请求地址的HTML内容(获取html的地址,select选择器)
this.GetHtml = function (getHtmlUrl, jquerySelectDom) {
$.ajax({
type: "GET",
url: getHtmlUrl,
data: "",
dateType: "html",
//false代表只有在等待ajax执行完毕后才执行
async: false,
success: function (data) {
if (jquerySelectDom != "") {
var $data = $(data);
//由于$data是个集合,得到的是所有一级节点的jquery集合,所以,先从一级集合中找,再从所有子元素中找
var $result = $data.next(jquerySelectDom);
if ($result.length == 0) {
$result = $data.find(jquerySelectDom);
}
var resultHtml = "";
if ($result.length > 0) {
resultHtml = $result.html();
}
return resultHtml;
} else {
return data;
}
}
});
};
//普通Post请求
this.Post = function () {
$.ajax({
type: "POST",
url: "/ajax/" + this.handlerName + ".js?action=" + this.actionName,
data: this.data,
//false代表只有在等待ajax执行完毕后才执行
async: true,
success: function (json) {
try {
result = JSON.parse(json);
} catch (e) {
result = new Function("return " + json)();
}
if (window.Ajax.rollBack && window.Ajax.rollBack instanceof Function) {
window.Ajax.rollBack(result);
}
},
error: function (e) {
console.log(e);
}
});
};
//模拟Form表单请求-参数为FormData对象
this.FormPost = function () {
$.ajax({
type: "POST",
url: "/ajax/" + this.handlerName + ".js?action=" + this.actionName,
data: this.data,
//false代表只有在等待ajax执行完毕后才执行
async: true,
processData: false,
contentType: false,
success: function (json) {
try {
result = JSON.parse(json);
} catch (e) {
result = new Function("return " + json)();
}
if (window.Ajax.rollBack && window.Ajax.rollBack instanceof Function) {
window.Ajax.rollBack(result);
}
},
error: function (e) {
console.log(e);
}
});
};
};
window["Ajax"] = new Ajax();