Struts2+json+jQuery(用户名验证)
1、添加struts-2.2.3 jar包
???? commons-fileupload-1.2.2.jar
???? commons-io-2.0.1.jar
???? commons-lang-2.5.jar
???? commons-logging-1.1.1.jar
???? freemarker-2.3.16.jar
???? javassist-3.7.ga.jar
???? ognl-3.0.1.jar
???? struts2-core-2.2.3.jar
???? struts2-json-plugin-2.2.3.jar
???? xwork-core-2.2.3.jar
?
2、在web.xml中添加struts2配置
<!-- struts2在web.xml中的配置 --><filter><filter-name>struts2</filter-name><filter-class>org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter</filter-class></filter><filter-mapping><filter-name>struts2</filter-name><url-pattern>*.action</url-pattern></filter-mapping>
?
3、struts.xml配置
<?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE struts PUBLIC "-//Apache Software Foundation//DTD Struts Configuration 2.0//EN" "http://struts.apache.org/dtds/struts-2.0.dtd"><struts><constant name="struts.devMode" value="fasle" /><constant name="struts.i18n.encoding" value="utf-8" /><package name="default" extends="json-default" namespace="/test"><action name="json" method="checkLogin"><result name="success" type="json">/index.jsp</result></action></package></struts>
?
4、添加jQuery js包
??? WebRoot/scripts/jquery-1.6.1.js
?
5、src/com/yjw/action/jsonAction.java
package com.yjw.action;import java.io.Serializable;import com.opensymphony.xwork2.ActionSupport;public class jsonAction extends ActionSupport implements Serializable {private String userName;private int isExist;public int getIsExist() {return isExist;}public void setIsExist(int isExist) {this.isExist = isExist;}public String getUserName() {return userName;}public void setUserName(String userName) {this.userName = userName;}public String checkLogin() {if(this.userName.equals("admin")){this.userName = "yjw";this.isExist = 1;}else{this.setIsExist(0);}return SUCCESS;}}?
6、WebRoot/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>用户名验证</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="Content-Type" content="text/html;charset=UTF-8"><script type="text/javascript" src="scripts/jquery-1.6.1.js"></script><style type="text/css">.userText { /*控制文本框的边框是红色的实线*/border: 1px solid red;}</style><script type="text/javascript">$(document).ready(function() {var userName = $("#userName");//页面加载时清空textuserName.val("");var userName_span = $("#userName_span");var reg1 = /^[A-Za-z]{1}(\w){4,19}$/; //正则:5-20位字母、数字或下划线组合,首字符必须为字母var userName_span1 = "<font style='color:red'>请输入用户名!</font>";var userName_span2 = "<font style='color:red'>用户名已经存在!</font>";var userName_span3 = "<font style='color:green'>用户名可用!</font>";var userName_span4 = "<font style='color:red'>用户名格式不正确!</font>";userName.change(function() {//当userName文本框中没有数据时,设置文本框的border样式,做出提示var userNameVal1 = $.trim(userName.val());var userNameVal2 = userName.val();if(userNameVal1 == ""){userName.addClass("userText");userName_span.html(userName_span1);return false;}else{userName.removeClass("userText");userName_span.html("");if(!reg1.test(userNameVal2)){userName.addClass("userText");userName_span.html(userName_span4);return false;}else{//到服务端判断用户名是否存在$.post("test/json.action",{"userName":userNameVal1},function(result){if(result.isExist == 1){userName.removeClass("userText");userName_span.html(userName_span2);return false;}else{userName.removeClass("userText");userName_span.html(userName_span3);return true;}},"json");}}});});</script></head><body>请输入用户名:<input id="userName" type="text" /><span id="userName_span"></span><br></body></html> 1 楼 mianhuatangone 2011-06-19 引用var userNameuserNameVal2 = userName.val();