What is Ajax?
Ajax 全称 Asynchronous JavaScript and XML,其实它没有用到新的技术,只是将JavaScript技术和XML结合和发展,使Web应用更加高效和快捷
Why use Ajax?
B/S结构的不足
l 表现力比较弱, 相比C/S结构中的客户端程序,浏览器的表现力要吃次很多
l 效率比较低, 每一次的”请求”--”响应”过程中,其中有很多数据是重复的.
Ajax可以解决一定程度的问题
How to use Ajax?
l Ajax的工作原理
页面中内嵌JavaScript, 通过它的内置对象XMLHttpRequest发送数据给服务器,服务器处理完后发回的是XML数据, 最后在本地页面进行局部刷新
l Simple Example
1.jsp
<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<title>Ajax Simple Example</title>
</head>
<script type="text/javascript">
var req;
function test() {
req = new ActiveXObject('Microsoft.XMLHTTP');
req.open('get','server.jsp',true);
// 打开URL连接 true 表示 基于异步方式 即时返回
req.onreadystatechange=callback; //设置回调函数
req.send(null); //即时返回
}
function callback() {
var state = req.readyState;
if (state == 4) { //完成
var data = req.responseText;
fillinfo(data);
}
}
function fillinfo(message) {
var info = document.getElementById("info");
info.innerHTML = message;
}
</script>
<body>
<input type="button" value="click" onclick="test()">
<div id="info"></div>
</body>
</html>
server.jsp
<%
out.println("HelloWorld");
%>
效果:
点击click按钮后,会发现页面并没有刷新,而按钮下面就显示了HelloWorld,这就是Ajax最简单的应用了.
分享到：
相关推荐
对ajax的初步了解和简单使用方法。 内容：初步认识ajax；ajax的同步和异步；ajax状态码；ajax请求兼容问题；发送带参数的GET/POST请求；封装ajax的过程；
在提供的MyEclipse项目中，`AjaxTest`可能包含了一个示例，演示了如何在实际项目中使用Ajax进行异步提交。通常，这会涉及到HTML页面中触发Ajax请求的按钮，以及对应的JavaScript代码来处理请求和更新结果。 **9. ...
3. **前进/后退按钮**：不恰当的Ajax处理可能导致用户无法正常使用浏览器的历史记录功能。 4. **用户体验**：如果Ajax请求失败或出现错误，用户可能不清楚发生了什么。 **Ajax的应用场景：** 1. **表单提交**：即时...
【dynaTrace_Ajax版使用指南】是一篇详细介绍如何使用dynaTrace Ajax版本的文档，旨在帮助用户理解和解决Web 2.0和Ajax应用程序中的性能和功能问题。该指南特别强调了在前端页面生命周期解析方面的详细性，适用于...
ASP.NET AJAX，全称为ASP.NET Asynchronous JavaScript and XML，是一种微软提供的技术框架，...对于初学者来说，通过阅读"asp.net ajax初步入门"这样的电子图书，可以逐步掌握这些技能，开启在ASP.NET领域的开发之旅。
AJAX 不是新的编程语言，而是一种使用现有标准的新方法。 AJAX 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术 传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。 有很多使用 AJAX ...
本教程将对基于jQuery的Ajax应用进行初步探讨。** ### 一、jQuery与Ajax的结合 jQuery库通过$.ajax()函数提供了对Ajax的全面支持。这个函数是jQuery中进行Ajax请求的核心，它可以处理GET、POST以及其他HTTP请求...
这个视频可能涵盖了Ajax的初步介绍，包括如何创建XMLHttpRequest对象，发送GET请求，以及处理简单的响应。观看此视频，学习者可以对Ajax有一个基本的认识，并开始动手实践。 综上所述，Ajax视频教程将涵盖Ajax的...
Ajax初步技术 word
6. **表单验证**：在客户端进行初步验证后，AJAX将数据发送到PHP进行服务器端验证，防止跨站脚本攻击等安全问题。 7. **实时聊天**：AJAX可以定时轮询或使用WebSocket技术与PHP服务器通信，实现实时聊天功能。 8. ...
客户端首先使用JavaScript的正则表达式进行初步校验，然后通过Ajax将邮箱地址发送到服务器。服务器端再次进行更严格的格式检查，确保邮箱的合法性。如果邮箱格式有误，服务器会返回错误信息，客户端接收后更新提示。...
- 表单验证，前端JavaScript初步验证后，再通过Ajax提交数据至服务器进行深度校验。 通过这些实例，开发者可以深入理解JSP和Ajax如何协同工作，以及如何利用它们来创建高性能、高互动性的Web应用。掌握这些技能对于...
而"ReadMe.txt"文件通常包含了安装指南、版本信息、更新日志以及可能遇到的问题和解决方案，对于初次使用者来说，这是获取初步信息和帮助的重要来源。 总的来说，Ajax控件通过提供丰富的用户界面组件和便捷的异步...
三、为什么使用AJAX. 4 四、谁在使用AJAX. 6 五、用AJAX改进你的设计... 6 例子1：数据校验... 7 例子2：按需取数据—级联菜单... 7 例子3：读取外部数据... 7 六、AJAX的缺陷... 7 七、AJAX...
综上所述，AJAX在JAVA上的应用可以结合MVC模式，通过创建XML数据、使用AJAX异步请求这些数据，然后在客户端动态更新视图，从而提高Web应用的响应速度和用户体验。同时，我们还讨论了JAVA中生成XML的技巧以及如何在...
3. 数据格式：尽管名字中有XML，但现代Ajax更多使用JSON，因为JSON更轻量且易于处理。 4. DOM（Document Object Model）：用于在接收到新数据后更新页面元素。 CSS设计则是关于网页样式和布局的，它定义了网页元素...
8. **前端验证与后端验证**：前端的Ajax验证只能作为初步检查，防止无效输入，但真正的安全验证应在服务器端进行，以防止恶意绕过前端验证。 9. **响应式设计**：考虑到不同设备和浏览器的兼容性，Ajax登录验证的...
通过这个简单的Ajax例子，你应该已经对Ajax有了初步的了解。随着实践的深入，你会发现Ajax在Web开发中有着广泛的应用，能够显著提升网站的用户体验和性能。继续学习和探索，你将能更好地掌握这一关键技术。
在前端，我们可以使用JavaScript的正则表达式来初步判断日期格式是否符合要求。如果格式不正确，可以立即给予用户反馈，防止错误的数据提交到服务器。而Ajax则可以实现这种实时、无刷新的验证机制。 首先，我们需要...