ajax 基础 0 突破

最新推荐文章于 2024-11-04 16:42:12 发布

xtayhicbladwin

最新推荐文章于 2024-11-04 16:42:12 发布

阅读量458

点赞数

分类专栏： ajax 文章标签： ajax xmlhttprequest function initialization server equals

本文链接：https://blog.csdn.net/xtayhicbladwin/article/details/5002821

版权

ajax 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

最近一段时间用jquery，感觉效果挺好的，对此感兴趣。jquery里面有一个最重要的就是ajax的应用，看来我这里也得从头学学ajax的基础知识，不然看juqery的代码，也比较的费劲。

好，这里就写些测试代码。希望和我一样的新手能多多探讨。

========================ajax笔记=================

Ajax组成：

1 JavaScript;

2 CSS（页面样式）;

3 DOM（页面局部管理）;

4 xmlHttpRequest（异步对象）;

5 异步对象链接服务器;

var xmlHttp; var xmlhttpObj = ["MSXML2.XmlHttp.5.0","MSXML2.XmlHttp.4.0","MSXML2.XmlHttp.3.0","MSXML2.XmlHttp","Microsoft.XmlHttp"];//为的是ie fireFox兼容 function createXMLHttpRequest(){ if(window.ActiveXObject){ for(i=0;i<xmlhttpObj.length;i++) { s xmlHttp = new ActiveXObject(xmlhttpObj[i]); if(xmlHttp) { break; } alert(xmlhttpObj[i]); } } else if(window.XMLHttpRequest){ xmlHttp=new XMLHttpRequest(); }else{ alert("暂时不能创建XMLHttpRequest对象"); } return xmlHttp?xmlHttp:false; }

======================================================================

xmlHttp.open("GET","AjaxTest.action",true); //"GET"传值方法，"AjaxTest.action"异步请求的地址，true表示异步

请求

判断交互状态：
onreadystatechange事件

xmlHttp.onreadystatechange=function(){ //服务器状态发生变化时调用此函数。
if(xmlHttp.readyState==4&&xmlHttp.status==200) //判断异步交互是否成功
//do something
}

send()发送
xmlHttp.send(null); //get方法只需send（null） post 就需要将传的参数写到里成例子：xmlHttp.send(parmaters);

=================================================

jsp页面代码：

ajaxTest:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>'ajaxTest.jsp' </title> <mce:script type="text/javascript"></mce:script> </head> <body> <form action="" method="get"> <input type="button" value="测试异步通讯" onClick="startRequest()"> </form> </body> </html>

AjaxTest.java代码 //是个servlet

public class AjaxTest extends HttpServlet { /** * Constructor of the object. */ public AjaxTest() { super(); } /** * Destruction of the servlet. <br> */ public void destroy() { super.destroy(); // Just puts "destroy" string in log // Put your code here } /** * The doGet method of the servlet. <br> * * This method is called when a form has its tag value method equals to get. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doPost( request, response); } /** * The doPost method of the servlet. <br> * * This method is called when a form has its tag value method equals to post. * * @param request the request send by the client to the server * @param response the response send by the server to the client * @throws ServletException if an error occurred * @throws IOException if an error occurred */ public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { response.setCharacterEncoding("utf-8"); response.setContentType("text/html; charset=utf-8"); PrintWriter out = response.getWriter(); String message="嘎嘎!"; out.println(message); out.flush(); out.close(); } /** * Initialization of the servlet. <br> * * @throws ServletException if an error occurs */ public void init() throws ServletException { // Put your code here } }