简单使用ajax(get方式)

ajax的使用,老是查了忘,忘了查,这里记录一下简单使用的情况:

 

需求:

      输入账号,查询该账号的相关属性,为了使效果好看一点,这里使用ajax,将查询出来的结果直接放在输入框下边显示。

 

代码如下:

1、selectUser.jsp

<%@ page language="java" contentType="text/html; charset=GB18030" pageEncoding="GB18030"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=GB18030"> <title>Insert title here</title> </head> <mce:script type="text/javascript" language="javascript"><!-- var XMLHttpReq = false; function createXMLHttpRequest(){      if(window.XMLHttpRequest){        XMLHttpReq = new XMLHttpRequest();      }else if(window.ActiveXObject){        XMLHttpReq = new ActiveXObject("Mircsoft.XMLHTTP");      }else { alert("未能创建XMLHttpRequest对象"); return false; } } function sendRequest(url){      createXMLHttpRequest();      XMLHttpReq.open("GET",url,true);      XMLHttpReq.onreadystatechange = processResponse;      XMLHttpReq.send(null); } function processResponse(){      if(XMLHttpReq.readyState == 4){         if(XMLHttpReq.status == 200){ var obj = document.getElementById("res"); obj.innerHTML = XMLHttpReq.responseText;         }else{             window.alert("请求的页面有异常");         }      } } function selectByPassport(){      var p = document.form1.passport.value;      if(p == ""){         window.alert("请输入查询通行证");         document.form1.passport.focus();         return false;      }else{         sendRequest("SelectByPassport?p="+p);      } } // --></mce:script> <body> <p>1、根据passport查用户信息</p> <form name="form1" method="post" action=""> <p>passport: <input type="text" name="passport"> <input type="button" name="Submit" value="查询" onClick="return selectByPassport()"> </p> <div id="res"></div> </form> </body> </html>

 

 

 

2、SelectByPassport.java是一个Serverlet,具体完成的事情是,取得对应p的相关信息,返回给浏览器。主要代码如下:

 

StringBuffer re_buffer=new StringBuffer(""); if(r.size()>0){ re_buffer.append("通行证:"+p+"<br>"); }else{ re_buffer.append("通行证"+p+"-- 未查到对应记录"); } for(KeyValue kv:r.raw()){ re_buffer.append(new String(kv.getColumn())+":"+new String(kv.getValue())+"<br>"); } resp.setCharacterEncoding("utf-8"); PrintWriter out=resp.getWriter(); out.write(re_buffer.toString()); out.flush(); out.close();

 

你可能感兴趣的:(JavaScript,Ajax,String,function,input,XMLhttpREquest)