ajax方法

最新推荐文章于 2024-02-17 13:45:00 发布

沐淼

最新推荐文章于 2024-02-17 13:45:00 发布

阅读量325

点赞数 1

分类专栏： js、jQuery、html

本文链接：https://blog.csdn.net/mqf163/article/details/61420671

版权

js、jQuery、html 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

<!doctype html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Jquery对Ajax的支持</title>
		<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
		<script type="text/javascript">
			//load()可以发送异步请求，	并将返回的数据写入指定的元素内
			function f1(){
				//$("p")表示将返回的数据写入p
				//load方法的第一个参数是url
				//第二个参数是本次请求需要传给服务器的数据；
				//可以通过json来写这个数据，JQuery再发出请求时会自动将json转成key=value格式的字符串
				//load函数没有回调函数，实际上他内置了回调函数，在此函数内他将返回数据写入了jQuery对象。
				$("p").load("hi",{"name":"mumiao"});
			}
			//异步的get请求
			function f2(){
				//比load多了回调函数，该函数在 readyState == 4 && status == 200 时被调用。
				//函数的参数就是返回的json字符串
				//第4个参数是返回的数据的类型，若设置为json，则jQuery会自动将返回值转成对象
				$.get(
					"hi",
					{"name":"mumiao"},
					function(data){
						//data={"age":30,"name":"mumiao"}
						//var obj = JSON.parse(data);
						alert(data.name);
					},
					"json"
				);    
			}
			//异步的post请求
			function f3(){
				$.post(
					"hi",
					{"name":"mumiao"},
					function(data){
						alert(data.name);
					},
					"json"
				);
			}
			//使用ajax()发送异步请求，可以灵活的配置请求的相关的各个参数。
			function f4(){
				$.ajax({
						"url":"hi",
						"type":"post",	//请求类型
						"data":{"name":"mumiao"},	//请求数据
						"dataType":"json",		//返回的数据类型
						"success":function(data){
							alert(data.name);
						},	//成功时的回调函数
						"error":function(data){
							alert("系统报错，抱歉");
						}		//错误时的回调函数
					}
				);
			}
			
		</script>
	</head>
	<body>
		<button οnclick="f1();">load</button>
		<button οnclick="f2();">get</button>
		<button οnclick="f3();">post</button>
		<button οnclick="f4();">ajax</button>
		<p></p>
	</body>
</html>

get() 用法$.get( 请求地址 ,请求参数 ,回调函数 ,服务器返回的数据说明 );

ajax() 用法$.ajax({});{}内的参数是可选的

-url:请求地址

-type ：请求方式

-data：请求参数

-dataType：服务器返回的参数类型

-success：服务器处理正常对应的回调函数

-error：服务器出错对应的回调函数

-async：true（缺省）当值为false事发送同步请求

注：服务器返回的参数类型：

html：HTML文本

text：文本

JSON：js对象

xml：XML文档

script：JavaScript脚本

沐淼

关注

1
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
ajax方法

Jquery对Ajax的支持 //load()可以发送异步请求，并将返回的数据写入指定的元素内 function f1(){ //$("p")表示将返回的数据写入p //load方法的第一个参数是url //第二个参数是本次请求需要传给服务器的数据； //可以通过json来写这个数据，JQuery再发出请求时会自动将json转成key=va
复制链接

扫一扫