原文地址:http://www.jb51.cc/article/p-wyyjdhjt-bbt.html

jquery的ajax方式有如下几种:
1. $.post(url,params,callback);
2. $.getJSON(url,callback);
3. $.ajax();
4. $.load(url,callback);

第一种:采用post方式提交,中文参数无需转码,在callback中如果要获取json字符串,还需转换一下。
如:

[javascript] view plain copy
  1. $.post(url,
  2. {id:id,
  3. code:code,
  4. companyId:companyId
  5. },
  6. function(data){
  7. showCompanyRadialDataListdatalist
  8. });
  9. 这个datalist为从后台取回来的数据List。
  10. functionshowCompanyRadialDataList(datalist){
  11. varobj=eval(datalist);
  12. }//这个eval可以将data转成json串。方便后面取值。
  13. 如:
  14. for(vari=0;i<obj.length;i++){
  15. $("td:eq(1)",$tr).htmlobj[i].nuclide);//这里可以用json方式取datalist里面的数据
  16. }

第2种方式:getJSON采取get方式提交,所以如果你的params参数里面有中文的话,请先转码,否则会出现乱码提交到后台。
[javascript] view plain copy
  1. $.getJSON(url,param,function(jsondata){
  2. 这里返回的jsondata可以直接取不用再转换了。
  3. 如:jsondata[0].nuclide
  4. }

第3种方式:$.ajax, 这种方式最灵活。

[javascript] view plain copy
  1. $.ajax({
  2. url:url,//地址
  3. data:data,//参数
  4. type:'POST',//提交方式可以选择post/get推荐post
  5. async:false,//同步异步
  6. dataType:'json',//返回数据类型
  7. success:function(data){
  8. accidentList=data.list;
  9. //这里可以直接取data里面的数据了,因为设置返回值为json方式。
  10. }
  11. });

当然$.ajax里面还有很多参数 可以加更多的特效在里面,如ajaxStart,ajaxStop等等,
上面的参数type,async,dataType都不是必须的。
第4种方式:$.load 这种用得很少,一般是来加载某一个页面或者xml等等。

总结:如果参数中没有中文,又想直接用json,那就推荐$.getJSON,如果有中文 那就采用$.post或者$.ajax。


以上转自:http://pipe.iteye.com/blog/372394#


然而数据传输方式多种多样,

以键值对的字符串形式:简单方便"param1=value1&param2=value2"

以xml方式:虽然有点麻烦,但是当遇到复杂结构的数据类型时用得上,详细见:点击打开链接

以json方式: JSON JavaScript原生格式,这意味着在 JavaScript中处理 JSON数据不需要任何特殊的 API或工具包。点击打开链接


然而需要注意的是:jquery.js会与json.js冲突,据说是因为$符号冲突...

1.网上有制作jquery的插件js对象与json互相转换的jQuery插件jquery-json

http://blog.csdn.net/mycup163/article/details/7090077

var thing = {plugin: 'jquery-json', version: 2.3};

var encoded = $.toJSON( thing );
// '{"plugin":"jquery-json","version":2.3}'
var name = $.evalJSON( encoded ).plugin;
// "jquery-json"
var version = $.evalJSON(encoded).version;
// 2.3

2.如果不想用json.js可以这样...手动写json点击打开链接..服务器发送过来的json可以用jquery的eval("("+data+")")/$.parseJson()转化为javascript对象






终于到服务器端了

为了怕以后的开发中出现同样的问题,现将问题记录起来 关于json与struts交互的问题 前台技术采用extjs: strut2提供了支持json的插件 必须继承json-default、json-default继承自struts-default. <package name="json" namespace="/"extends="json-default"> <action name="moduleAction" class="moduleAction">

<result type="json"name="findData"> <paramname="root">datas</param> <paramname="includeProperties">success,totalcount</param> </result> <result type="json"name="findTree"> <paramname="root">result</param> </result> </action> 1,result中type设置成json之后,容器会把action的属性自动封装到一个json对象中(json拦截器来做),然后调用ajax的callback方法.返回json数据 2,includeProperties参数:输出结果中需要包含的属性值,这里正则表达式和属性名匹配,可以用“,”分割填充多个正则表达式。 如<paramname="includeProperties">module.*,user\.userName</param>表示是module的所有属性及用户的用户名 3,excludeProperties参数:输出结果需要排除的属性值,也支持正则表达式匹配属性名,可以用“,”分割填充多个正则表达式,类同includeProperties 4,为什么要用includeProperties或excludeProperties 参数: 主要是为了过滤掉接口,pojo的set、list、其它对象等不需要的数据防止循环取其它关联对象或找不到接口。 如果不配置,默认是处理action中的所有属性,如果action中有接口注入,json拦截器可能找不到接口而返回不了结果, 还有如果action中有一个对象,这个对象与好多对象都有关联,json拦截器会将相关联的所有对象的属性全部转换成json格式, 如果其它对象有list、set,其返回结果相当庞大,有可能是死循环而无法返回 。 如果不用<paramname="includeProperties">或其他方式进行json数据过滤,通过debug你会发现前台返回的json字符串, 是把action中的所有属性全部转化成json字符串返回给客户端 (包括service接口、pojo所有属性及有关联的pojo。有时候根本返回不了结果,也不报错,后台执行了, 但前台执行不到callbackfunction,这主要是因为找不到接口或者关联的pojo太多,造成死循环), 一般情况下用的最多的就是root、 includeProperties和excludeNullProperties参数。 当然还有其他的方法,如给pojo的属性加json注解。 5,result标签中的name属性,即表示是struts2中的action类中返回的名称 如 public String findAllById() throws Exception{ int id=Integer.parseInt(this.request.getParameter("pid")); List<ModuleBean>list=service.findById(id); return "findTree"; } 上面代码return"findTree"就会找到findTree的结果集,并将其封装起来,返回json给客户端 因此 action 可以配置多个result

【communication】ajax之jquery与struts2通信的更多相关文章

  1. canvas中普通动效与粒子动效的实现代码示例

    canvas用于在网页上绘制图像、动画,可以将其理解为画布,在这个画布上构建想要的效果。本文详细的介绍了粒子特效,和普通动效进行对比,非常具有实用价值,需要的朋友可以参考下

  2. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  3. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  4. H5混合开发app如何升级的方法

    本篇文章主要介绍了H5混合开发app如何升级的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  5. 详解html5 postMessage解决跨域通信的问题

    这篇文章主要介绍了详解html5 postMessage解决跨域通信的问题的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  6. canvas学习和滤镜实现代码

    这篇文章主要介绍了canvas学习和滤镜实现代码,利用 canvas,前端人员可以很轻松地、进行图像处理,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  7. 详解使用postMessage解决iframe跨域通信问题

    这篇文章主要介绍了详解使用postMessage解决iframe跨域通信问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  8. HTML5数字输入仅接受整数的实现代码

    这篇文章主要介绍了HTML5数字输入仅接受整数的实现代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  9. amaze ui 的使用详细教程

    这篇文章主要介绍了amaze ui 的使用详细教程,本文通过多种方法给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  10. localStorage的过期时间设置的方法详解

    这篇文章主要介绍了localStorage的过期时间设置的方法详解的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

随机推荐

  1. xe-ajax-mock 前端虚拟服务

    最新版本见Github,点击查看历史版本基于XEAjax扩展的Mock虚拟服务插件;对于前后端分离的开发模式,ajax+mock使前端不再依赖后端接口开发效率更高。CDN使用script方式安装,XEAjaxMock会定义为全局变量生产环境请使用xe-ajax-mock.min.js,更小的压缩版本,可以带来更快的速度体验。

  2. vue 使用 xe-ajax

    安装完成后自动挂载在vue实例this.$ajaxCDN安装使用script方式安装,VXEAjax会定义为全局变量生产环境请使用vxe-ajax.min.js,更小的压缩版本,可以带来更快的速度体验。cdnjs获取最新版本点击浏览已发布的所有npm包源码unpkg获取最新版本点击浏览已发布的所有npm包源码AMD安装require.js安装示例ES6Module安装通过Vue.use()来全局安装示例./Home.vue

  3. AJAX POST数据中文乱码解决

    前端使用encodeURI进行编码后台java.net.URLDecoder进行解码编解码工具

  4. Koa2框架利用CORS完成跨域ajax请求

    实现跨域ajax请求的方式有很多,其中一个是利用CORS,而这个方法关键是在服务器端进行配置。本文仅对能够完成正常跨域ajax响应的,最基本的配置进行说明。这样OPTIONS请求就能够通过了。至此为止,相当于仅仅完成了预检,还没发送真正的请求呢。

  5. form提交时,ajax上传文件并更新到&lt;input&gt;中的value字段

  6. ajax的cache作用

    filePath="+escape;},error:{alert;}});解决方案:1.加cache:false2.url加随机数正常代码:网上高人解读:cache的作用就是第一次请求完毕之后,如果再次去请求,可以直接从缓存里面读取而不是再到服务器端读取。

  7. 浅谈ajax上传文件属性contentType = false

    默认值为contentType="application/x-www-form-urlencoded".在默认情况下,内容编码类型满足大多数情况。在这里,我们主要谈谈contentType=false.在使用ajax上传文件时:在其中先封装了一个formData对象,然后使用post方法将文件传给服务器。说到这,我们发现在JQueryajax()方法中我们使contentType=false,这不是冲突了吗?这就是因为当我们在form标签中设置了enctype=“multipart/form-data”,

  8. 909422229_ajaxFileUpload上传文件

    ajaxFileUpload.js很多同名的,因为做出来一个很容易。我上github搜AjaxFileUpload出来很多类似js。ajaxFileUpload是一个异步上传文件的jQuery插件传一个不知道什么版本的上来,以后不用到处找了。语法:$.ajaxFileUploadoptions参数说明:1、url上传处理程序地址。2,fileElementId需要上传的文件域的ID,即的ID。3,secureuri是否启用安全提交,默认为false。4,dataType服务器返回的数据类型。6,error

  9. AJAX-Cache:一款好用的Ajax缓存插件

    原文链接AJAX-Cache是什么Ajax是前端开发必不可少的数据获取手段,在频繁的异步请求业务中,我们往往需要利用“缓存”提升界面响应速度,减少网络资源占用。AJAX-Cache是一款jQuery缓存插件,可以为$.ajax()方法扩展缓存功能。

  10. jsf – Ajax update/render在已渲染属性的组件上不起作用

    我试图ajax更新一个有条件渲染的组件。我可以确保#{user}实际上是可用的。这是怎么引起的,我该如何解决呢?必须始终在ajax可以重新呈现之前呈现组件。Ajax正在使用JavaScriptdocument.getElementById()来查找需要更新的组件。但是如果JSF没有将组件放在第一位,那么JavaScript找不到要更新的内容。解决方案是简单地引用总是渲染的父组件。

返回
顶部