AJAX
AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。
AJAX 不是新的编程语言,而是一种使用现有标准的新方法。
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。
AJAX 是与服务器交换数据并更新部分网页的艺术,在不重新加载整个页面的情况下。
AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
http://www.w3school.com.cn/ajax/index.asp
在要刷新的页面input中动态更新
<body
<TR>
<th width="20%" align="center">用户登录名</th>
<TD class="BGCgray"><input name="ur_loginName" type="text"
class="inputbox" id="ur_loginName"
style="width:160px;hight:20px"
value="${sessionScope.user.ur_loginName }" onblur="lnTest()"><span
id="login" style="color:red"></span></TD>
</TR>
</body>
<script>
function lnTest() {
var ur_loginName = document.getElementById("ur_loginName").value;
var login = document.getElementById("login");
var id = "${sessionScope.user.ur_id}";
var ymsz = /^[A-Za-z0-9]+$/;
var loginname = document.getElementById("loginname").value;
if(loginname==ur_loginName){
return true;
}else if (kong.test(ur_loginName)) {
login.style.color = "red";
login.innerHTML = " × 账户不可以为空";
return false;
} else if (ymsz.test(ur_loginName)) {
xml = new XMLHttpRequest();
xml.open("get", "AJAXServlet.do", true);
xml.setRequestHeader("name", ur_loginName);
xml.setRequestHeader("ur_id", id);
xml.send(null);
xml.onreadystatechange = function(){
if (xml.readyState == 4) {
var msg = xml.responseText;
var login = document.getElementById("login");
if (msg == 1) {
login.style.color = "red";
login.innerHTML = " × 该用户名已被使用";
return false;
} else if (msg != 1) {
login.style.color = "green";
login.innerHTML = " √ 该用户名可以使用";
return true;
}
}
};
} else {
login.style.color = "red";
login.innerHTML = " × 账户格式不正确 ";
return false;
}
}
</script>
使用ajax来在点击input框时,动态更新用户名,判断输入的用户名是否在原数据库中存在
ajaxservlet.java
package com.xxpx.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import com.xxpx.bean.User;
import com.xxpx.service.UserService;
import com.xxpx.service.UserServiceImpl;
public class AJAXServlet extends HttpServlet{
UserService service = new UserServiceImpl();
@Override
protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
// TODO Auto-generated method stub
request.setCharacterEncoding("utf-8");
response.setCharacterEncoding("utf-8");
System.out.println("--->AJAX");
String id = request.getHeader("ur_id");
System.out.println("id="+id);
List list1 = new ArrayList();
list1.add(id);
System.out.println("list1="+list1);
HttpSession session = request.getSession();
List<User> list = this.service.AjaxUser(list1);
String name = request.getHeader("name");
System.out.println("name="+name);
response.setContentType("text/html");
PrintWriter out = response.getWriter();
boolean flag = false;
for(User a : list){
System.out.println(a.getUr_loginName());
if((a.getUr_loginName()).equals(name)){
flag = true;
}
}
if(flag == true ){
out.print(1);
}else{
out.print(0);
}
out.flush();
out.close();
}
}
web.xml配置
<display-name>AJAXTest</display-name>
<servlet>
<servlet-name>AJAXServlet</servlet-name>
<servlet-class>com.xxpx.servlet.AJAXServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>AJAXServlet</servlet-name>
<url-pattern>/AJAXServlet.do</url-pattern>
</servlet-mapping>