一个简单的Ajax例子

今天写个Ajax的小例子，我在项目中并没有用到过Ajax，看到Ajax很流行，今天写个demo，希望大家指点

创建一个全局的XMLrequest对象，该对象的方法如下

open()：建立到服务器的新请求。

send()：向服务器发送请求。

abort()：退出当前请求。

readyState：提供当前 HTML 的就绪状态。

responseText：服务器返回的请求响应文本。

Onreadystatechange属性的五种状态：

0：请求没有发出（在调用 open() 之前）。
1：请求已经建立但还没有发出（调用 send() 之前）。
2：请求已经发出正在处理之中（这里通常可以从响应得到内容头部）。
3：请求已经处理，响应中通常有部分数据可用，但是服务器还没有完成响应。

jsp代码如下：

<html>
<head>
   <script language="javascript" type="text/javascript">
var XMLrequest = false;
try {
  request = new XMLHttpRequest();
} catch (trymicrosoft) {
  try {
   XMLrequest = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (othermicrosoft) {
   try {
    XMLrequest = new ActiveXObject("Microsoft.XMLHTTP");
   } catch (failed) {
    XMLrequest = false;
   }
  }
}
if (!XMLrequest){
  alert("Error initializing XMLHttpRequest!");
}
function callServer() {
    // Get the city and state from the web form
    var name = document.getElementById("name").value;
    var pwd = document.getElementById("pwd").value;
    // Only go on if there are values for both fields
    if ((name == null) || (name == "")) return;
    if ((pwd == null) || (pwd == "")) return;
    // Build the URL to connect to
    var url = "http://localhost:8080/ajaxproject/servlet/Login?name=" + escape(name) + "&pwd=" + escape(pwd);

　 //escape() 方法，它用于转义不能用明文正确发送的任何字符。比如，电话号码中的空格将被转换成字符 %20
    // Open a connection to the server
    XMLrequest.open("GET", url, true);
    // Setup a function for the server to run when it's done
    XMLrequest.onreadystatechange = updatePage;
    // Send the request
    XMLrequest.send(null);
  }
function updatePage() {
    if (XMLrequest.readyState == 4) {
      var response = XMLrequest.responseXML;
      var re = response.getElementsByTagName("name")[0].firstChild.nodeValue;
      document.getElementById("xianshi").value = re ;
    }
  }
</script>
</head>
<body>
  <form action="" method="get">
   <input type="text" name="name" onChange="callServer();"/>
   <input type="password" name="pwd" onChange="callServer();"/>
   <input type="submit" name="submit" onClick=""/>
  </form>
  <form action="">
   <input type="text" name="xianshi" id="xianshi" value=""/>
  </form>
</body>
</html>

servetlet代码如下：

String name = request.getParameter("name");
  response.setContentType("text/xml;charset=utf-8");
  response.setHeader("Cache-Control", "no-cache");
  String xml = "<response>";
  if(name == null || name.trim().equals("")){
   xml +="<name>null</name>";
  }else {
   xml+="<name>"+name+"</name>";
  }
  xml+="</response>";
  PrintWriter out = response.getWriter();
  out.print(xml.toString());
  out.close();

转载于:https://www.cnblogs.com/xingzhen/archive/2011/05/30/2063153.html

一个简单的Ajax例子相关推荐

struts2框架下的一个简单的ajax例子
举个例子 jsp页面: <%@ page language="java" import="java.util.*" pageEncoding=" ...
使用struts2+JQuery实现的简单的ajax例子
也为简单的业务需要,所以使用了Struts配合JQuery制作的一个简单的AJAX的例子,希望有兴趣的朋友可以看看. Js代码 <script type="text/javascr ...
mvc登录实例 mysql_spring mvc + mybatis + mysql 调整的一个简单的登录例子
spring mvc + mybatis + mysql 整合的一个简单的登录例子今天用spring跟mybatis整合写了一个简单的登录例子,第一次整合,给自己做个笔记,可能注释写的有点少,做的不 ...
一个简单的Ajax开发框架
根据Ajax与XMLHttpRequest对象一文的介绍,我们可以开发一个简单的Ajax框架供以后开发应用. 首先要知道Ajax的开发流程: 1:初始化XMLHttpRequest,这一步要考虑跨浏览 ...
ajax登陆返回值判断,一个简单的ajax用户登陆返回值问题？有代码
一个简单的ajax用户登陆返回值问题?有代码來源:互聯網 2009-11-13 11:55:56 評論分類: 電腦/網絡 >> 程序設計 >> 其他編程語言問題描述: ...
boost::log模块实现一个简单日志的例子
boost::log模块实现一个简单日志的例子实现功能 C++实现代码实现功能 boost::log模块实现一个简单日志的例子 C++实现代码 #include <boost/log/tri ...
轻松创建nodejs服务器（1）：一个简单nodejs服务器例子
这篇文章主要介绍了一个简单nodejs服务器例子,本文实现了一个简单的hello world例子,并展示如何运行这个服务器,需要的朋友可以参考下我们先来实现一个简单的例子,hello world. ...
使用jQuery来实现一个简单的ajax请求
下面的程序使用ajax来实现一个简单的ajax请求 JSP页面代码 <%@ page language="java" import="java.util.*&quo ...
一个简单的CORBA例子
因为对CORBA分析的需要,这里写一个简单的CORBA例子.从JDK1.2开始,JDK中集成了ORB的实现,本例子使用了JDK1.7,对于JDK1.2+应该都没有问题.这个例子实现一个简单的加减乘除的 ...

一个简单的Ajax例子

一个简单的Ajax例子相关推荐

最新文章

热门文章