jQuery中ajax()方法的详细介绍

来源：动视网责编：小采时间：2020-11-27 20:14:56

jQuery中ajax()方法的详细介绍

jQuery中ajax()方法的详细介绍:$.ajax()方法：* 发送data主要有3种方式 * 1.json 数组(推荐1) * 2.url拼接 * 3.表单的序列化serialize(推荐2) (1)json 数组(推荐1)$(function(){ var myClick = function(){ var userName = $().val(); var m

推荐度：

点击下载本文 文档为doc格式

导读jQuery中ajax()方法的详细介绍:$.ajax()方法：* 发送data主要有3种方式 * 1.json 数组(推荐1) * 2.url拼接 * 3.表单的序列化serialize(推荐2) (1)json 数组(推荐1)$(function(){ var myClick = function(){ var userName = $().val(); var m

$.ajax()方法：

* 发送data主要有3种方式
* 1.json 数组(推荐1)
* 2.url拼接
* 3.表单的序列化serialize(推荐2)

(1)json 数组(推荐1)

$(function(){
 var myClick = function(){
 var userName = $().val();
 var myDate = {userName:usrName};
 var myFunction = function(result){alert(result)};
 var eeorFunction = function(){alert("发生异常")};
 
 $.ajax({
 url:'B',//目标为Servlet B发送请求地址
 type:'GET',/*访问Servlet B请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。*/
 date：myDate,//把信息提交给Servlet数据
 dateType:'text',//返回类型为文本类型
 　 success:myFunction,//成功后的回调函数，result为服务器返回的内容
 　 error:errorFunction,
 　 timeout:2000　　　　　　/*
　　　　　　　　$.ajax()以上7个方法都是常用方法。
　　　　　　*/
 });
 }
 $("#img").click(myClick);
}); 

<body>
 <form>
 　　<input id="userName" name="userName"value="xiaoming"><br>
 　　<img id="img" src="img/1.png"> 　　</form></body>

(2)url拼接

$(function(){
 var myClick = function(){
 var userName = $().val();
 var myDate = {userName:usrName};
 var myFunction = function(result){alert(result)};

 /*var eeorFunction = function(){alert("发生异常")};*/
　　　　var errorFunction = function(XMLHttpRequest,textStatus){
　　　　//alert('发生错误');
　　　　if (XMLHttpRequest.status==404){
　　　　alert('找不到服务器[404]');
　　　　} else if(XMLHttpRequest.status==500){
　　　　alert('服务器忙，请稍后再试[500]');
　　　　}else{
　　　　alert('服务器错误['+XMLHttpRequest.status+']');
　　　　}
　　　}　
 $.ajax({
 url:'B?userName='+$("#userName").val(),//目标为Servlet B发送请求地址

 type:'GET',/*访问Servlet B请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。*/
 date：myDate,//把信息提交给Servlet数据
 dateType:'text',//返回类型为文本类型
 　 success:myFunction,//成功后的回调函数，result为服务器返回的内容
 　 error:errorFunction,
 　 timeout:2000
 });
 }
 $("#img").click(myClick);
}); 

<body>
 <form>
 　　<input id="userName" name="userName"value="xiaoming"><br>
 　　<img id="img" src="img/1.png"> 　　

 </form></body>

(3)　表单的序列化serialize(推荐2)

$(function(){

　　　　var kk = $("#userName").serialize();
　　　　var tt = $("#frm1").serialize();
　　　　//alert(t //var myClick = function //var userName = $().val();
 //var myDate = {userName:usrName}; 

 var myFunction = function(result){alert(result)};
 /*var eeorFunction = function(){alert("发生异常")};*/
　　　var errorFunction = function(XMLHttpRequest,textStatus){
　　　　//alert('发生错误');
　　　　if (XMLHttpRequest.status==404){
　　　　alert('找不到服务器[404]');
　　　　} else if(XMLHttpRequest.status==500){
　　　　alert('服务器忙，请稍后再试[500]');
　　　　}else{
　　　　alert('服务器错误['+XMLHttpRequest.status+']');
　　　　}
　　　}　
 $.ajax({
 url:'B?userName='+$("#userName").val(),//目标为Servlet B发送请求地址

 type:'GET',/*访问Servlet B请求方式（post或get）默认为get。注意其他http请求方法，例如put和delete也可以使用，但仅部分浏览器支持。*/
 date：myDate,//把信息提交给Servlet数据
 dateType:'text',//返回类型为文本类型
 　 success:myFunction,//成功后的回调函数，result为服务器返回的内容
 　 error:errorFunction,
 　 timeout:2000
 });
 }
 $("#img").click(myClick);
}); 

<body>
 <form>
 　　<input id="userName" name="userName"value="xiaoming"><br>
　　　　<input id="sex" name="sex" value="男"><br>
　　　　<img id="img" src="img/1.png"> 　　</form></body>

jQuery中ajax()方法的详细介绍

推荐度：

点击下载本文 文档为doc格式

标签：方法介绍实现

热门焦点

jQuery中ajax()方法的详细介绍

jQuery中ajax()方法的详细介绍

jQuery中ajax()方法的详细介绍

最新推荐

猜你喜欢

热门推荐