1,简介
$.ajax方法是jQuery 的底层AJAX 实现
简单易用的高层实现参见$.get $.post
此处有6个Ajax参数 type , dataType,url,success,data error
简单易用的高层实现参见$.get $.post
此处有6个Ajax参数 type , dataType,url,success,data error
2,属性参数说明
属性名 | 属性值类型 | 描述 |
url | string | 发送请求的地址(默认当前页面) |
type | string | 默认 get 请求方式 post get 其他HTTP请求方法 也可以,仅部分浏览器支持 |
data | Object,string | 发送到服务器的数据 将自动转为请求字符串格式,get请求中将附加在URL后 |
dataType | string | 预期服务器返回的数据类型 xml 返回Xml文档 可用jQuery 进行处理 html 返回纯文本HMTl信息,包含script元素 script返回纯文本JavaScript代码 不会自动缓存结果 json 返回JSON数据 |
error | Function | 默认为XML或HTML 请求失败将调用此方法,此方法有三个参数 XML 、HttpREquest对象 ,错误信息以及可能捕获的错误对象 |
success | Function | 请求成功后回调函数 该方法有两个参数 服务器返回数据 和 返回状态 |
3,代码实例
$(function () {
$("#LoginAdd").dialog({
title: "注册",
collapsible: true,
width: 300,
height: 200,
modal: true,//模态对话框
buttons: [
{
text: '添加',
iconCls: 'icon-add',
handler: function () {
console.info("添加用户");
ajaxFrm();//ajax 提交表单函数
}
}
]
});
//ajax提交
function ajaxFrm() {
var list = $("#LoginList");
$.ajax({
type: 'POST',
dataType: 'json',
url: 'T7.aspx',//相对路径
data: $("#form1").serialize(),//表单成员 必须包含 name 序列化表单值,创建 URL 编码文本字符串。
success: function (data) {
console.info(data);//调试代码
if (data.intChk == 0) {
list.html("");//清空数据
$.each(data.rows, function (i, it) {
var str = list.html() + it.intNum + "用户名" + it.uid + "--密码" + it.pwd + "</br>";
list.html(str);
});
}
},
error: function (error) {
console.info(error);
}
});
}
<div id="LoginAdd">
<form id="form1">
<table>
<tr>
<td>用户名</td>
<td><input name="zh" id="zh" /></td>
</tr>
<tr>
<td>密码</td>
<td><input name="mm" id="mm" /></td>
</tr>
</table>
</form>
</div>
<div id="LoginList">
123456789
</div>