基于JQuery的$.ajax()、$.get()和$.post()的用法

悠悠 2021-09-23 14:32 403阅读 0赞

在JQuery的Ajax异步请求中总共有三种编写方式，他们分别是是：ajax()、get()和post()，如果想要使用以上的方法，需要引入JQuery插件，有需要的读者可以在评论区下留言进行留言。下面我来总结一下它们各自的使用格式和应用方式：  
**（一）ajax()**  
       JQuery原生的ajax编写格式，具有多个参数来设置相关的操作。  
书写格式为：

$.ajax({ 
    	url:"",//异步请求访问链接
    	data:"",//提交的数据，将自动转换为请求字符串格式
    	dataType:"",//json,xml,text,html等
    	type:"post",//默认值: "GET"。请求方式 ("POST" 或 "GET")
    	async:true,//默认为true，即默认为异步请求，否则为同步请求
    	success:function(data){ 
    		//当异步请求完成时所执行的回调函数
    	} 
    });

当然，ajax()还有许多属性，笔者只是把相对常用的属性写到上面。

**（二）get()**  
       用于从服务器获得（取回）数据，可能返回缓存数据。  
书写格式为：

$.get(url,callbackFuction);

①解释：  
1、url：指异步请求所指向的url访问链接；  
2、callbackFuction:指异步请求完成时需要执行的回调函数；

②具体应用：

$.get("/admin/index",function(data){ 
    		console.log(data);//在控制台中输出异步请求返回的data数据
    		//.............
    		//此处也可以进行数据处理及其他操作。
    	}
    );

function(data)中的data参数是异步请求/admin/index链接时所返回的数据。当然，get()也 可以传递参数到请求中进行处理，只不过要写在url上，如：

$.get("/admin/index?mudules=admin&&userName=admin",function(data){ 
    		console.log(data);//在控制台中输出异步请求返回的data数据
    		//.............
    		//此处也可以进行数据处理及其他操作。
    	}
    );

**（三）post()**  
       用于从服务器获取数据，但是它不会缓存数据，并且常用于连同请求一起发送数据。  
书写格式为：

$.post(url,data.callbackFuction);

①解释：  
1、url：指异步请求所指向的url访问链接；  
2、data：post请求需要提交的数据；  
3、callbackFuction：指异步请求完成时需要执行的回调函数；

②具体应用：

$.post("/admin/index",{ name:"小明",sex:"男"}.function(data){ 
    		console.log(data);//在控制台中输出异步请求返回的data数据
    		//........
    		//......
    	}
    );

此处提交的数据可以在java后端中通过ServletRequest 的 request来进行获取，如下所示：

String name = request.getParameter("name")；//变量名自定义
    String sex = request.getParameter("sex")；

（四）设置全局同步

$.ajaxSetup({ 
           async : false;//全局同步，设置为true，则为全局异步
    });

本文主要是笔者对自己使用过的一些开发技术进行总结，以便在之后中使用。如果有读者发现文中存在错误，请多多指出，笔者也会虚心接受的。