当我们用javascript写ajax程序写得很“开心”的时候,突然有人告诉你有一种东西叫jquery,它会告诉你不直接和HttpRequest是多么的快乐,同时你再也不需要再烦恼纠结的ajax乱码问题,更幸福的是你的js代码将大大地简化,看完本文,你会发现,ajax,简单的来讲就是一句话的事情。
本文重点是来讲讲jQuery中调用ajax的4种方法:$.get、$.post、$getJSON、$ajax。如果读者没有javascript和jquery的知识,或者没有ajax的概念,那么请先去问问google老大,再来读本文。
1、$.get
$.get()方法使用GET方式来进行异步请求,它的语法结构为:
$.get( url [, data] [, callback] )
解释一下这个函数的各个参数:
url:string类型,ajax请求的地址。
data:可选参数,object类型,发送至服务器的key/value数据会作为QueryString附加到请求URL中。
callback:可选参数,function类型,当ajax返回成功时自动调用该函数。
最后写一个$.get()的实例供大家参考:
1
2
3
4
5
6
7
8
9
10
11
|
$.get( "submit.aspx" ,{
id: '123' ,
name: '青藤园' ,
}, function (data,state){
//这里显示从服务器返回的数据
alert(data);
//这里显示返回的状态
alert(state);
}
) |
2、$.post()
$.post()方法使用POST方式来进行异步请求,它的语法结构为:
$.post(url,[data],[callback],[type])
这个方法和$.get()用法差不多,唯独多了一个type参数,那么这里就只介绍type参数吧,其他的参考上面$.get()的。
type:type为请求的数据类型,可以是html,xml,json等类型,如果我们设置这个参数为:json,那么返回的格式则是json格式的,如果没有设置,就和$.get()返回的格式一样,都是字符串的。
最后写一个$.post()的实例供大家参考:
1
2
3
4
5
6
7
8
9
10
11
12
|
$.post( "submit.aspx" ,{
id: '123' ,
name: '青藤园' ,
}, function (data,state){
//这里显示从服务器返回的数据
alert(data);
//这里显示返回的状态
alert(state);
},
"json"
) |
3、$.getJSON()
$.getJSON()是专门为ajax获取json数据而设置的,并且支持跨域调用,其语法的格式为:
getJSON(url,[data],[callback])
url:string类型, 发送请求地址
data :可选参数, 待发送 Key/value 参数 ,同get,post类型的data
callback :可选参数,载入成功时回调函数,同get,post类型的callback
JSON是一种理想的数据传输格式,它能够很好的融合与JavaScript或其他宿主语言,并且可以被JS直接使用。使用JSON相比传统的通过 GET、POST直接发送“裸体”数据,在结构上更为合理,也更为安全。至于jQuery的getJSON()函数,只是设置了JSON参数的 ajax()函数的一个简化版本。这个函数也是可以跨域使用的,相比get()、post()有一定优势。另外这个函数可以通过把请求url写 成"myurl?callback=X"这种格式,让程序执行回调函数X。
4、$.ajax()
$.ajax()是jquery中通用的一个ajax封装,其语法的格式为:
$.ajax(options)
其中options是一个object类型,它指明了本次ajax调用的具体参数,这里我把最常用的几个参数附上
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
$.ajax({ url: 'submit.aspx' ,
datatype: "json" ,
type: 'post' ,
success: function (e) { //成功后回调
alert(e);
},
error: function (e){ //失败后回调
alert(e);
},
beforeSend: function (){ /发送请求前调用,可以放一些 "正在加载" 之类额话
alert( "正在加载" );
}
}) |
好了,以上就是jquery实现ajax调用的几种方法,希望对大家有所帮助。
转自:http://www.itivy.com/jquery/archive/2011/7/6/jquery-get-post-getjson-ajax.html
相关推荐
而Jquery库提供了一系列封装好的Ajax函数,如$.get(), $.post(), $.ajax(), 和$.getJSON(),这些函数简化了前端开发者与后端数据交互的过程。 ### 1. $.get() `$.get()`函数是最简单的一种异步请求方式,它发送一...
本篇将详细介绍如何解决jQuery跨域问题,涉及的方法包括$.get、$.post和$.getJSON等。 首先,我们需要理解什么是跨域。同源策略是浏览器为保障安全而实施的一项机制,它规定JavaScript只能访问与当前页面同源(协议...
asp+ajax(jQuery)实例($.ajax()、$.post()、$.get()、$.getJSON()四种模式可选 Ajax是目前比较流行的网站建设技术,尤其作为网站建设者来说,掌握它十分有必要,如果用原生Javascript开发则比较困难,还好有强大的...
在jQuery库中,`$.getScript()`和`$.getJSON()`是两种非常实用的异步数据获取方法,它们分别用于加载JavaScript脚本和获取JSON格式的数据。这些方法都是基于jQuery的`$.ajax()`基础构建的,提供了更为简洁和方便的...
本篇文章将深入探讨jQuery中的异步调用方法,包括`$.ajax()`,`$.post()`和`$.get()`,以及它们在实际开发中的应用。 首先,`$.ajax()`是jQuery提供的最强大的异步数据请求函数,它支持多种HTTP请求方法,如GET、...
本文将详细探讨 `$.post()` 的使用方法,特别是在传递 JSON 数据时的应用。 #### 一、`$.post()` 基础介绍 `$.post()` 是 jQuery 提供的一个用于发起 POST 请求的方法,它的基本语法如下: ```javascript $.post...
结合其他jQuery的Ajax方法,如`$.post()`和`$.getJSON()`,我们可以构建出功能丰富的、用户体验良好的Web应用。在实际开发中,理解并熟练运用这些工具至关重要,以便更好地优化和提升我们的项目。
1. jQuery的$.get和$.post方法:这两种方法是jQuery提供的Ajax(异步JavaScript和XML)接口,用于与服务器进行非刷新的数据交换。$.get用于发送GET请求,而$.post用于发送POST请求。它们都接受四个参数:URL、数据、...
在jQuery中,$.ajax()和$.getJSON()是两种常见的用于发送Ajax请求的方法,它们主要用于与服务器进行异步数据交互。然而,在某些特定场景下,如处理表单提交前的验证,可能需要同步处理请求,确保数据正确无误后再...
接下来,我们将详细介绍jQuery中各种AJAX函数,包括$.get()、$.post()、$.ajax()和$.getJSON()。 首先,$.get()方法是一种简单实现GET请求的方式。它的语法是$.get(url, [data], [callback])。其中url参数代表请求...
在jQuery中,有四种主要的Ajax方法用于与服务器进行异步数据交互,它们分别是$.get(), $.post(), $.ajax()和$.getJSON()。这些方法简化了JavaScript中的Ajax操作,使得开发者能够更加便捷地处理数据交互。 1. **$....
在jQuery库中,$.post, $.get和$.getJSON是用于执行AJAX(Asynchronous JavaScript and XML)请求的三种主要方法,这些方法使得前端与后端服务器进行异步数据交互成为可能,无需刷新整个页面。接下来,我们将详细...
本文重点是来讲讲jQuery中调用ajax的4种方法:$.get、$.post、$getJSON、$ajax。如果读者没有javascript和jquery的知识,或者没有ajax的概念,那么请先去问问度娘,再来读本文。
在jQuery库中,$.get()和$.post()是两种非常常用的Ajax请求方法,它们用于向服务器发送异步请求,获取或提交数据,而无需刷新整个页面。这些方法都是全局函数,与jQuery对象的方法如.load()有所不同,后者是对特定...
对于$.ajax请求来说,如果层级比较多,程序看起来会比较乱,而为了解决这种问题,才有了$when…done…fail…then的封装,它将$.ajax这嵌套结构转成了顺序平行的结果,向下面的$.ajax写法,看起来很乱 $.ajax({ url...
在学习jQuery的AJAX操作时,理解`$.post()`和`$.get()`的基本用法是至关重要的,这将帮助开发者快速实现前后端数据交互,提高网页的动态性和用户体验。通过实践和不断探索,开发者可以更好地掌握这些方法,并将其...