`
wusuoya
  • 浏览: 641537 次
  • 性别: Icon_minigender_2
  • 来自: 成都
社区版块
存档分类
最新评论

jquery Ajax 方法返回数据的获取,包括JSON,XML,TXT

    博客分类:
  • web
 
阅读更多

JQuery提供了一系列的全局方法对XMLHttpRequest对象进行了封装,在进行Ajax开发过程中再也不用担心浏览器客户端的不致性问题了。


它是最根本的JQuery Ajax方法,它只有一个参数options,该options参数中包含了请求信息和回调函数的信息。参数内容都是key:value对形式出现,并且都是可选的。
语法:

url
:(string)发送请求的地址,可以是服务器页面也可以是WebService动作。
type:(string)请求方式,POST或GET
data:(object)向服务器发送请求时带去的数据。是key:value对形式,如:
dataType:(string)预期返回的数据类型。xml,html,json,text等
beforeSend:(Function)发送ajax请求前被触发,如果返回false则取消本次请求。如果异步请求需要显示gif动画,那应当在这里设置相应<img>的可见。

complete:(Function)请求调用完成后的回调函数(请求成功或失败时均调用),如果异步请求显示gif动画,那应当在这里设置相应的<img>不可见。

success:(Function)请求执行成功时的回调函数

error:(Function)请求执行失败时的回调函数 

1.向页面发出请求,返回XML格式数据
页面端代码:


《图3》
JQuery代码:


《图1》

2.向页面发出请求,返回Json格式数据
页面端代码:


《图4》
JQuery代码:


《图2》

3.向WebService发出请求,无参返回简单类型异步调用
服务端代码:


《图5》
JQuery代码:


《图6》

4.向WebService发出请求,有参返回简单类型异就调用
服务端代码:


《图7》
JQuery代码:


《图8》

5.向WebService发出请求,返回实体对象的异步调用
服务端代码:


《图9》
JQuery代码:


《图10》

6.向WebService发出请求,返回集合对象的异步调用
服务端代码:


《图11》
JQuery代码:


《图12》

说明:
        WebService请求类型都为Post,WebService的Url为“[WebServiceUrl]/[WebMethod]”
        data要用Json的字符串格式传入
        设置了dataType为json后,result就直接为返回的Json对象。


$.ajax()是最基本的Ajax方法,在JQuery中又提供了两个简捷的Ajax调用方法$.get()和$.post(),这两个方法实现了对$.ajax()的封装。有了$.ajax()的基础,下面两个方法学习起来就很简单了。

语法:
url:(string)请求的HTML页的URL地址
data:(object)发送到服务器的数据,以key/value对形式书写,如:{name:"张三",age:"18"}
callback:(function)回调函数,只有返回的状态是success时才调用该方法。
type:(string)服务端返回的内容的格式。xml,html,json,text等


语法:
url:(string)请求的HTML页的URL地址
data:(object)发送到服务器的数据,以key/value对形式书写,如:{name:"张三",age:"18"}
callback:(function)回调函数,只有返回的状态是success时才调用该方法。
type:(string)服务端返回的内容的格式。xml,html,json,text等

$.post()与$.get()很相似,只是数据参数传递方式不一样,这二者与传统的get/post提交方式相同。


1.$.get()和$.post()向页面发送异步请求,返回XML数据
服务端代码:


《图3》
JQuery代码:


《图13》

2.$.get()和$.post()向页面发送异步请求,返回json数据
服务端代码:


《图4》
JQuery代码:


《图14》
3.$.get()和$.post()向WebService发送异步请求


《图15》:


如果页面表单元素比较多,在发出ajax请求的时候需要将表单中所有的元素一起发送到服务端,如果还是使用key/value对形式的json语法传递参数的话,那需要在$.get()或$.post()中手写很长的json参数。
在JQuery中为我们提供了序列化的方式来解决这个问题,序列化的方法是serialize()
示例代码:


《图16》

 

 原文链接:http://hi.baidu.com/zhangfei6263/item/39115b247c75553495f62bf8

分享到:
评论

相关推荐

    SSH1,JQuery的ajax返回json二维数组处理过程

    在本文中,我们将探讨如何使用SSH1框架与jQuery的AJAX功能来处理JSON二维数组,特别是在实现菜单...整个流程包括前端的AJAX请求、后端的JSON数据处理以及UI交互逻辑。理解这些技术对于开发复杂的Web应用程序至关重要。

    JQuery+AJAX处理XML数据

    **jQuery + AJAX 处理 XML 数据** 在网页开发中,jQuery 和 AJAX 技术的结合是获取和操作服务器端数据的常见方式。本篇将详细探讨如何使用 jQuery 的 AJAX 功能来处理 XML(可扩展标记语言)数据。 **1. jQuery 和...

    Jquery ajax json 总结

    JQuery AJAX 和 JSON 是在 Web 开发中处理异步数据传输和数据格式化的重要工具。本文将深入探讨这两个概念以及它们在实际应用中的使用方法。 首先,JQuery 的 AJAX(Asynchronous JavaScript and XML)功能允许...

    jQuery中使用Ajax获取JSON格式数据示例代码.pdf

    总结来说,从给定文件的内容来看,介绍了 JSON 数据格式的特性,jQuery 中处理 Ajax 请求的基本方式,以及如何通过 jQuery 的 `$.ajax()` 和 `$.getJSON()` 方法获取和处理 JSON 数据。同时,还通过实际的代码示例,...

    jQuery xml-to-json xml转JSON插件

    jQuery xml-to-json插件是一种用于将XML数据转换为JavaScript Object Notation (JSON)格式的工具。在Web开发中,XML和JSON都是常见的数据交换格式,但它们有着不同的应用场景和优势。XML(Extensible Markup ...

    Struts2 与Jquery Ajax的json数据交换的典型范例

    总结,Struts2和jQuery的Ajax JSON数据交换涉及以下几个关键步骤:配置Struts2的JSON插件,编写返回JSON数据的Action,使用jQuery发起Ajax请求并处理返回的JSON数据。通过这种方式,可以实现客户端与服务器之间的...

    jquery AJAX 回调函数取JSON成功代码

    在这个场景中,我们讨论的是如何使用jQuery的AJAX方法来获取并处理JSON格式的数据。 首先,让我们深入了解jQuery的$.ajax()函数。这是一个核心的jQuery方法,用于发起Ajax请求。JSON(JavaScript Object Notation)...

    SSH框架ajax获取的json格式数据处理过程

    首先,我们使用 JQuery 的 Ajax 方法来获取 JSON 数据,然后使用 JQuery 的 parseJSON 方法来解析 JSON 数据。 三、菜单联动下拉框的实现 要实现菜单联动下拉框,我们需要使用 JavaScript 和 HTML 代码来实现。...

    jQuery ajax、post、get、json格式传递数据例子

    本篇文章将深入探讨jQuery中的ajax、post、get方法以及如何使用json格式传递数据。 1. **jQuery的$.ajax()函数** `$.ajax()`是jQuery提供的核心Ajax功能,它可以实现异步数据交互。通过配置各种参数,可以灵活地...

    JQuery AJAX跨域提交参数、接收json数据.docx

    JQuery AJAX 跨域提交参数、接收 JSON 数据 JQuery 的 AJAX 功能是实现异步数据...JQuery 的 AJAX 功能提供了多种方法来实现跨域提交参数和接收 JSON 数据,我们可以根据具体情况选择合适的方法来实现跨域数据交互。

    jquery.json2xml.js和jquery.xml2json.js

    在jQuery的基础上,`jquery.json2xml.js` 和 `jquery.xml2json.js` 这两个脚本提供了方便的方法来在JSON和XML之间进行转换,从而让开发者无需深入了解这两种格式的复杂性,就能轻松地在它们之间进行数据互换。...

    struts2+jquery执行ajax并返回json类型数据(源码)

    在这个"struts2+jquery执行ajax并返回json类型数据"的示例中,我们将探讨如何通过Ajax技术在后台Struts2框架与前端jQuery库之间交换JSON格式的数据。 首先,Struts2是一个强大的MVC(Model-View-Controller)框架,...

    Ajax +jquery跨域获取JSON

    在IT行业中,Ajax(Asynchronous JavaScript and XML)与jQuery库的结合经常被用来实现异步数据交互,提高网页的用户体验。这里的"Ajax + jQuery跨域获取JSON"是一个典型的Web开发技术应用场景,主要用于解决Web应用...

    php基于jquery的ajax技术传递json数据简单实例.docx

    本文主要介绍了 PHP 基于 jQuery 的 Ajax 技术传递 JSON 数据方法,以完整实例形式分析了 PHP 基于 jQuery 的 Ajax 无刷新提交数据实现方法。下面是详细的知识点说明: HTML 页面 在 HTML 页面中,我们首先引入 ...

    jQuery+get/post+Ajax+Json

    1. jQuery的$.get和$.post方法:这两种方法是jQuery提供的Ajax(异步JavaScript和XML)接口,用于与服务器进行非刷新的数据交换。$.get用于发送GET请求,而$.post用于发送POST请求。它们都接受四个参数:URL、数据、...

    jQuery Ajax 三级省市联动 (JSON)

    这里我们将深入探讨如何使用jQuery和Ajax技术实现这一功能,并结合JSON数据格式来动态加载和展示地区信息。 首先,理解jQuery是一个轻量级的JavaScript库,它简化了DOM操作、事件处理、动画以及Ajax交互。Ajax全称...

    jQuery ajax读取json文件内容

    此标题直截了当,明确指出将通过jQuery的Ajax技术来获取并解析JSON文件中的数据。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。而JSON(JavaScript ...

    详谈 Jquery Ajax异步处理Json数据.

    通过以上的知识点,可以了解到在Jquery Ajax异步处理JSON数据的过程中,开发者需要了解前端如何发送请求、指定期望的响应数据类型、以及如何在回调函数中处理服务器返回的JSON格式数据。这种机制使得Web应用可以提供...

    jQuery_Ajax_Json全解析

    jQuery的Ajax方法常用于从服务器获取JSON数据,实现页面动态更新。例如,使用`$.getJSON()`获取JSON数据并更新页面: ```javascript $.getJSON('data.json', function(data) { var html = ''; $.each(data.items,...

    jquery ajax servlet json简单demo

    在jQuery中,$.ajax()方法是进行AJAX请求的核心函数,它可以实现异步数据获取与页面更新。 【AJAX使用】在jQuery中,使用AJAX通常包括以下步骤: 1. 引入jQuery库:确保HTML文件中包含了jQuery库,通常通过CDN链接...

Global site tag (gtag.js) - Google Analytics