`
lgywindows
  • 浏览: 9349 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

ajax的最简示例

阅读更多
  
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简单示例 .net实现

    AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX 初学者示例AJAX ...

    asp.net 2.0+ajax 的简单示例

    asp.net 2.0+ajax 的简单示例哦,大家可以学习看看。

    Ajax异步请求简单示例

    Ajax实现异步请求的示例 直接部署就可以运行 页面内局部刷新

    ajax简单示例.EXE

    MyEclipse 中 Ajax简单示例

    Ajax简单功能示例

    ajax异步传输的简单示例,很实用的代码, 对于初学者有很好的启发作用

    ajax简单示例(非常好)

    这是一个ajax的简单示例,非常好,供大家使用

    ajax 简单示例

    手写ajax代码,很简单的示例,只需要导入就可以运行。如果使用框架,只需要在Action类里面定义一个空返回的方法,在ajax传递URL时指定使用这个方法即可。不用在Struts.xml中配置。

    ajax简单示例(易懂易上手)

    很简单 很容易理解的ajax示例 初学者 菜鸟也很容易懂 教你动态验证 动态显示

    关于ajax的简单示例

    做的一个简单的ajax例子 是用c#写的一个asp.net项目

    ajax简单示例和封装库

    内含ajax最简单的示例和已经封装好的库,可以直接拷贝使用

    简单的JqueryAjax的示例

    这是一个比较简单的Ajax示例。一看就会懂

    .net下最简单的ajax示例

    .net下最简单的ajax示例,很实用的功能

    Ajax+PHP的简单示例

    一个Ajax+PHP的简单示例 非常简单,主要是为了让刚入门的朋友,对这个过程有点了解 就算是起到一个抛砖引玉的作用吧! 做的不好,请各位不要骂我! 需要PHP支持,主要执行页面就是post.html&lt;br/&gt;要...

    Ajax无刷新分页示例源码2012419

    Ajax无刷新分页示例源码 程序介绍: 程序使用jquery方法提交请求,处理后将数据库绑定到页面中。 Ajax无刷新分页示例源码 程序介绍: 程序使用jquery方法提交请求,处理后将数据库绑定到页面中。 Ajax无...

    ajax简单应用示例

    ajax初级应用,对于初学者而言是值得参考的东西,对于老手来说,好久不用的话也有可能会忘掉

    DWR AJAX 简单示例

    DWR AJAX 级联下拉菜单,动态调用远程方法

    简单Ajax 类及示例

    简单Ajax 类及示例 直接在初始对像时请求 响应事件,容器 直接在初始对像时请求 仅响应事件 直接在初始对像时请求 仅响应容器 初始对像后操作 响应事件,容器 初始对像后操作 仅响应事件 初始对像后操作 仅响应容器 ...

    ajax的一个简单例子

    ajax的一个简单例子,这是一个小例子,可以仅供参考

    ajax入门级项目示例

    非常简单实用的ajax示例。使用ajax异步读取数据库表格数据。 下载后大家可自行在Sql server 中新建Test数据库,添加Record表,增加ID,UserID,ClassID,Score字段,即可完美运行本程序。

Global site tag (gtag.js) - Google Analytics