Ajax请求后端数据 附实例

1、Ajax简介

1.1简介

如需要快速应用，请直接跳转至实例，并结合一般参数介绍了解相关参数含义！
AJAX 是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

1.2优点

1.页面无刷新，用户体验好。
2.异步通信，更加快的响应能力。
3.减少冗余请求，减轻了服务器负担
4.基于标准化的并被广泛支持的技术，不需要下载插件或者小程序

1.3应用场景

1. 数据验证
2. 按需取数据
3. 自动更新页面

2、Ajax一般格式

$.ajax({  
     type: 'POST',  
     url: url ,  
     data: data ,
　　 dataType:dataType ,  
     success: success , 
     error: error   
});  

3、参数说明

3.1一般参数说明

1.url:发送请求的地址。

2.data:发送到服务器的数据。将自动转换为请求字符串格式。(可选)

3.success：当请求成功时运行的函数。

success: function(data) {
 			console.log(data);
 		},

4.dateType：预期服务器返回的数据类型(可选，默认执行智能判断)。
若指定有如下可用值:
“xml”: 返回 XML 文档，可用 jQuery 处理。
“html”: 返回纯文本 HTML 信息；包含 script 元素。
“script”: 返回纯文本 JavaScript 代码。不会自动缓存结果。
“json”: 返回 JSON 数据 。

5.async：(默认: true) 默认设置下，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为 false。注意，同步请求将锁住浏览器，用户其它操作必须等待请求完成才可以执行。

3.2完整参数说明

完整参数说明请参见API手册：Ajax-API文档

4、实例

//存放不同的URL
urls = {    
 	//时间
 	"time": 'http://*',
 	//日期
 	"date": 'http://*',
 };
//请求数据：
 function getData_shijian(url,e,f,g) {
 	var result;
 	$.ajax({
 		type: "POST",
 		async: false,
 		url:url,
		data: {
			pass: e,
			now: f,
			future: g,
		},
 		dataType: "json",
 		success: function(data) {
 			console.log(data);
 			result = data;
 		},
 		error: function(message) {
             alert("请求数据失败!");
 		}
 	});
 	return result;
}

//调用函数
getData_shijian(urls.time,1,2,3);
getData_shijian(urls.date,1,2,3);