AJAX的最简示例
AJAX名词简略解释:
AJAX即“Asynchronous JavaScript and XML”(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术。
AJAX 不是一种新的编程语言,而是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术。
主要包含的技术:
使用 DOM(Document Object Model)进行动态显示及交互;
使用 XML 和 XSLT 进行数据交换及相关操作;
使用 XMLHttpRequest 进行异步数据查询、检索;
使用 JavaScript 将所有的东西绑定在一起。
本例的环境设定:
本例是用JQUERY来实现AJAX异步请求,需要用的jquery-1.7.2.js可以在
http://jquery.com/下载。
新建一个web项目,新建ajax_request.jsp并添加代码:
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<title>Insert title here</title>
<script type="text/javascript" src="./ref/jquery-1.7.2.js"></script>
<script type="text/javascript">
function ajax_request(){
var text = $("#text1").val();
$.ajax({
type:"POST",
url:"ajax_response.jsp",
data:"text="+text,
success:function(msg){
$("#div1").html(msg);
}
});
}
</script>
</head>
<body>
这是一个ajax请求的例子<br/>
<input type="text" id="text1" name="text1" />
<input type="button" id="button1" name="button1" value="点击后返回输入的值" onclick="ajax_request()"/>
<div id="div1"></div>
</body>
</html>
代码说明:
1 在$.ajax中的url参数添加action,可以是servlet或jsp。
2 在$.ajax中的data参数添加传递的参数,多个参数用&分开,具体的格式示例如下:name=John&location=Boston
3 $.ajax中的success:function(msg)中的msg是自已写的变量,用来接收后台传回来的数据。
4 如果代码还有不懂的地方可以翻阅jquery的中文chm。
5 需要的架包和chm放在附件中。
新建ajax_response.jsp并添加代码:
<%@ page language="java" contentType="text/html; charset=gbk" pageEncoding="gbk"%>
<%
//ajax_response.jsp充当ajax的后台使用
String requestParam = (String)request.getParameter("text");
System.out.println("requestParam->"+requestParam);
out.println("后台处理后的"+requestParam);
out.flush();
%>
代码说明:
1 ajax的后台可以用jsp,也可以用servlet。本例是使用jsp实现。
2 本例现在如果使用中文作参数会出现乱码问题。这里不提供解决方案。
3 out对象是jsp的内置对象,相当于在servlet中声明对象:
java.io.PrintWriter out = response.getWriter();
4 请注意不要带返回值。
分享到:
相关推荐
AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX ...
asp.net 2.0+ajax 的简单示例哦,大家可以学习看看。
Ajax实现异步请求的示例 直接部署就可以运行 页面内局部刷新
MyEclipse 中 Ajax简单示例
ajax异步传输的简单示例,很实用的代码, 对于初学者有很好的启发作用
这是一个ajax的简单示例,非常好,供大家使用
手写ajax代码,很简单的示例,只需要导入就可以运行。如果使用框架,只需要在Action类里面定义一个空返回的方法,在ajax传递URL时指定使用这个方法即可。不用在Struts.xml中配置。
很简单 很容易理解的ajax示例 初学者 菜鸟也很容易懂 教你动态验证 动态显示
做的一个简单的ajax例子 是用c#写的一个asp.net项目
内含ajax最简单的示例和已经封装好的库,可以直接拷贝使用
这是一个比较简单的Ajax示例。一看就会懂
.net下最简单的ajax示例,很实用的功能
一个Ajax+PHP的简单示例 非常简单,主要是为了让刚入门的朋友,对这个过程有点了解 就算是起到一个抛砖引玉的作用吧! 做的不好,请各位不要骂我! 需要PHP支持,主要执行页面就是post.html<br/>要...
Ajax无刷新分页示例源码 程序介绍: 程序使用jquery方法提交请求,处理后将数据库绑定到页面中。 Ajax无刷新分页示例源码 程序介绍: 程序使用jquery方法提交请求,处理后将数据库绑定到页面中。 Ajax无...
ajax初级应用,对于初学者而言是值得参考的东西,对于老手来说,好久不用的话也有可能会忘掉
DWR AJAX 级联下拉菜单,动态调用远程方法
简单Ajax 类及示例 直接在初始对像时请求 响应事件,容器 直接在初始对像时请求 仅响应事件 直接在初始对像时请求 仅响应容器 初始对像后操作 响应事件,容器 初始对像后操作 仅响应事件 初始对像后操作 仅响应容器 ...
ajax的一个简单例子,这是一个小例子,可以仅供参考
非常简单实用的ajax示例。使用ajax异步读取数据库表格数据。 下载后大家可自行在Sql server 中新建Test数据库,添加Record表,增加ID,UserID,ClassID,Score字段,即可完美运行本程序。