1.Ajax:
先导入jar包:
struts.xml:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.3//EN" "http://struts.apache.org/dtds/struts-2.3.dtd"> <struts> <package name="ajaxDemo" extends="json-default"> <action name="user-*" class="cn.zzsxt.action.UserinfoAction" method="{1}"> <result name="success" type="json"> <param name="root">list</param> </result> </action> </package> </struts>
UserinfoAction:
package cn.zzsxt.action; import java.io.PrintWriter; import java.util.List; import javax.servlet.http.HttpServletResponse; import org.apache.struts2.interceptor.ServletResponseAware; import com.opensymphony.xwork2.ActionSupport; import cn.zzsxt.entity.Userinfo; import cn.zzsxt.service.UserinfoService; import cn.zzsxt.service.impl.UserinfoServiceImpl; public class UserinfoAction extends ActionSupport implements ServletResponseAware{ private UserinfoService userinfoService = new UserinfoServiceImpl(); private String userName; private HttpServletResponse response; private List<Userinfo> list; public String getUserName() { return userName; } public void setUserName(String userName) { this.userName = userName; } public List<Userinfo> getList() { return list; } public void setList(List<Userinfo> list) { this.list = list; } /** * 检查用户名是否存在 * @return * @throws Exception */ public String check() throws Exception { boolean isExist = userinfoService.checkUserName(userName); PrintWriter out = response.getWriter(); if(isExist){ out.print("1"); }else{ out.print("0"); } return this.NONE; } /** * 加载用户列表 * @return * @throws Exception */ public String list() throws Exception { list = userinfoService.findAll(); return "success"; } @Override public void setServletResponse(HttpServletResponse arg0) { this.response=arg0; } }
register.jsp:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>用户注册</title> <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function(){ $("#userName").blur(function(){ //获取文本框的值 var userName = $(this).val(); $.post("user-check.action?userName="+userName,function(data){ if(data==true){ $("#msg").html("<font color=red>很遗憾,用户名已经存在!</font>"); }else{ $("#msg").html("<font color=green>恭喜你,用户名可用!</font>"); } }); }); }); </script> </head> <body> <form action="" method="post"> 用户名:<input type="text" name="userName" id="userName"><span id="msg"></span> </form> </body> </html>
index.jsp(列表):
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> <script type="text/javascript" src="js/jquery-3.2.1.min.js"></script> <script type="text/javascript"> $(function(){ //点击加载用户信息按钮时触发 $("#loadBtn").click(function(){ $.get("user-list.action",function(data){ //alert(data); var content=""; for(var i=0;i<data.length;i++){ //alert(data[i].userId+"---"+data[i].userName+"---"+data[i].userPass); content+="<tr><td>"+data[i].userId+"</td><td>"+data[i].userName+"</td><td>"+data[i].userPass+"</td></tr>"; } //alert(content); $("#userTbl tbody").html(content); }); }); }); </script> </head> <body> <input type="button" id="loadBtn" value="加载用户信息"> <table class="he" id="userTbl" align="center" border="1" width="500"> <thead> <tr> <th>用户编号</th> <th>用户名称</th> <th>用户密码</th> </tr> </thead> <tbody> </tbody> </table> </body> </html>