不管要求什么,要求到哪个路径文件,就返回哪个资源。

比如要求一份图片资源

浏览器得到

在jsp中遍历ajax返回值Ajax温习 Ruby

要求一段视频资源:

跳转的这个过程表示同步过程

浏览器要求什么资源,跟随显示什么资源’

二、Ajax-是一个异步要求

局部刷新。
通过异步要求,要求到做事器资源数据后通过脚本来修正页面中的部分内容。

Ajax是由JS(javascript)推出的.

由JQuery对JS中Ajax代码进行封装和简化达到方便利用的效果。

三、分类

第一层 $.ajax()函数 $.ajax({属性名:值,属性名:值})

是Jquery中功能最全的,代码写起来相对最难的。

<script type=&#34;text/javascript" src="js/jquery-1.7.2.js"&gt;</script><script type="text/javascript">/ url:要求做事器地址data:要求参数dataType:做事器返回数据的类型error:要求出错实行的功能success:要求成功实行的功能,function(data) data是做事器返回的数据type:要求办法/$(function(){$("a").click(function(){$.ajax({url: "demo",data:{"name":"张三"},dataType: "html",error:function(){alert("要求出错。
")},success: function(data){alert("要求成功"+data)},type: "post"})return false;})});</script>

当触发a 超链接时,向做事器要求demo(url),发送data,类型html,要求成功收到做事器数据。

这种第一层代码代码功能最全写起来麻烦

第二层:

$.get()

参数

url,[callback]String,FunctionV1.0

url:待载入 JS 文件地址。

callback:成功载入后回调函数。

$.post()

这两个相称于dataType,没有error

参数

url,[data],[callback],[type]String,Map,Function,StringV1.0

url:发送要求地址。

data:待发送 Key/value 参数。

callback:发送成功时回调函数。

type:返回内容格式,xml, html, script, json, text, _default。

代码实例:改写成post

参数servlet接管

$.post是为了简化$.ajax

第三层(简化$.get())

$.getJSON(url,data,success),相称于设置$.get中 dataType="json"

$.getScript(url,data,success),相称于设置$.get中dataType="script"

如果做事器返回数据是从表中取出的数据,为了方便客服端操作返回的数据,做事器返回的数据设置成JSON

客户端把JSON当作成数据或数组操作

JSON是一种数据格式

JSONObject:JSON工具,理解成Java中工具

{"key":value,"key":value}

JSONArray:JSON数组

[{"key":value,"key":value},{"key":value,"key":value}]

JSON常用的工具除了goson还有

复制到项目

把User的Java工具转换为JSON

浏览器访问:

Ajax要求json数据

浏览器得到的数据

这是一个工具

Ajax得到数组

[{"id":2,"usernameString":"李四","passwordString":"122223"},{"id":1,"usernameString":"张三","passwordString":"123"}]

Ajax遍历循环数组

得到返回数据

<%@ page language="java" import="java.util." pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script type="text/javascript" src="js/jquery-1.7.2.js"></script><script type="text/javascript">/ url:要求做事器地址data:要求参数dataType:做事器返回数据的类型error:要求出错实行的功能success:要求成功实行的功能,function(data) data是做事器返回的数据type:要求办法/$(function(){$("a").click(function(){/ $.ajax({url: "demo",data:{"name":"张三"},dataType: "html",error:function(){alert("要求出错。
")},success: function(data){alert("要求成功"+data)},type: "post"}) /$.post("demo",{"name":"张三"},function(data){var result="";for(var i=0;i<data.length;i++){result+="<tr>";result+="<td>"+data[i].id+"</td>";result+="<td>"+data[i].usernameString+"</td>";result+="<td>"+data[i].passwordString+"</td>";result+="<tr/>";}/相称于先清空后添加 /$("#mytbody").html(result)})return false;})});</script> </head> <body> <a href="">跳转</a><br> <table border="1"> <thead></thead> <tr> <td>编号</td> <td>姓名</td> <td>密码</td> </tr> <tbody id="mytbody"></tbody> <tfoot></tfoot> </table> </body></html>

求关注,早日打破100粉目标