使用struts2+Ajax+jquery验证用户名是否已被注册


Posted in Javascript onMarch 22, 2016

推荐阅读:JQuery+Ajax+Struts2+Hibernate框架整合实现完整的登录注册

在用户模块中的用户注册需求上,通常要进行用户名是否已被注册的验证,今天正好写了这个需求,把详细代码和所遇到的问题贴过来.在使用struts2+ajax时候,通常我们会返回json类型的数据,但是像上面的例子,我们只希望返回一个1和0有助于进行后续判断即可,没必要返回json类型,返回一个text字符串就可以了.

regist.jsp(这里只提供<script>部分):

<script type="text/javascript">
$(function() {
$("#userNiName").blur(function() {
var val = $(this).val();
val = $.trim(val);
var $this = $(this);
if (val != "") {
//把当前节点后面的所有 font 兄弟节点删除
$this.nextAll("font").remove();
var url = "user_checkName";
var args = {
"userNiName" : val,
"time" : new Date()
};
$.post(url, args, function(data) {
//表示可用
if (data == "1") {
$this.after("<font color='green'>用户名可用!</font>");
}
//不可用
else if (data == "0") {
$this.after("<font color='red'>用户名已被注册!</font>");
}
//服务器错误
else {
alert("服务器错误!");
}
});
} else {
$(this).val("");
$this.focus();
}
});
})
</script>

这里我是用了Jquery.post(url,args,function(data){..})函数提交ajax请求到指定url,并且携带参数args,最后用一个回调函数处理请求返回结果data.

UserAction:

public class UserAction extends ActionSupport implements ModelDriven<User>{
private User user=new User();
private UserService userService;
private InputStream inputStream;
public InputStream getInputStream() {
return inputStream;
}
//检验用户昵称是否存在
public String checkName() throws UnsupportedEncodingException{
System.out.println("进入ajax检验");
String userNiName=user.getUserNiName();
if(userService.findUserByName(userNiName)==null){
inputStream=new ByteArrayInputStream("1".getBytes("UTF-8"));
}else{
inputStream=new ByteArrayInputStream("0".getBytes("UTF-8"));
}
return "ajax_succ";
}
@Override
public User getModel() {
return user;
}
public void setUserService(UserService userService) {
this.userService = userService;
}
}

注意:这里我用的是ModelDriven的方式获取表单数据,而在使用ajax的时候,直接传了一个userNiName(昵称)过来,于是我在UserAction中加了一个私有字符串变量userNiName,并设置了set方法.结果死活传不过值来,传过来的是一个null,于是我将私有变量删掉,然后直接用user.getUserNiName()直接获取就得到了.切记.

UserService(省略).

User类(省略).

UserDao:

package com.wang.shop.user.dao;
import java.util.List;

import org.springframework.orm.hibernate4.support.HibernateDaoSupport;
import com.wang.shop.user.entity.User;
public class UserDao extends HibernateDaoSupport{
/**
* 通过用户昵称查询User
* @param userNiName
* @return
*/
public User findUserByName(String userNiName){
List<User> list = (List<User>) this.getHibernateTemplate().find("select u from User u where u.userNiName=?", userNiName);
if(list!=null&&list.size()>0){
System.out.println("list:"+list.get(0));
return list.get(0);
}
return null;
}
}

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="shop" namespace="/" extends="struts-default">
<!-- UserAction -->
<action name="user_*" class="userAction" method="{1}">
<result name="regist_succ">/WEB-INF/jspForUser/login.jsp</result>
<result type="stream" name="ajax_succ">
<param name="contentType">text/html</param>
<param name="inputStream">inputStream</param>
</result>
</action>
</package>
</struts>

注意在result标签中,type="stream".

最后顺带说一句,我在调试的时候习惯使用输出语句,但每次加一句输出语句都需要重启Tomcat,好烦.于是参考网上的方式,将Tmocat安装目录下,conf->server.xml中在<host>标签下添加了以下代码,就可以修改类(细微的修改)的时候,不需要重启服务器了:

<!--docBase就是你的项目工程所在的全路径,path就是写你的项目名,reloadable="true",可以自动重新加载修改过的class文件-->
<Context debug="0" docBase="D:\Tomcat 7.0\webapps\SSH_shop01" path="/SSH_shop01" reloadable="true" />

需要特别注意的是,当在Tomcat中卸载了该项目后,一定要回来将这个标签删除.

使用struts2+Ajax+jquery验证用户名是否已被注册的知识,小编就给大家介绍这么多,希望对大家有所帮助!

Javascript 相关文章推荐
屏蔽鼠标右键、Ctrl+n、shift+F10、F5刷新、退格键 的javascript代码
Apr 01 Javascript
js操作iframe父子窗体示例
May 22 Javascript
js中unicode转码方法详解
Oct 09 Javascript
JavaScript实现的伸展收缩型菜单代码
Oct 14 Javascript
浅析javascript中的事件代理
Nov 06 Javascript
JavaScript的模块化开发框架Sea.js上手指南
May 12 Javascript
微信小程序 wxapp导航 navigator详解
Oct 31 Javascript
详解jQuery的Cookie插件
Nov 23 Javascript
bootstrap实现的自适应页面简单应用示例
Mar 09 Javascript
webpack v4 从dev到prd的方法
Apr 02 Javascript
微信小程序异步API为Promise简化异步编程的操作方法
Aug 14 Javascript
Openlayers3实现车辆轨迹回放功能
Sep 29 Javascript
使用getBoundingClientRect方法实现简洁的sticky组件的方法
Mar 22 #Javascript
Node.js文件操作方法汇总
Mar 22 #Javascript
浅谈Sticky组件的改进实现
Mar 22 #Javascript
使用Sticky组件实现带sticky效果的tab导航和滚动导航的方法
Mar 22 #Javascript
关于JS中match() 和 exec() 返回值和属性的测试
Mar 21 #Javascript
快速掌握Node.js中setTimeout和setInterval的使用方法
Mar 21 #Javascript
快速掌握Node.js事件驱动模型
Mar 21 #Javascript
You might like
php实现PDO中捕获SQL语句错误的方法
2017/02/16 PHP
详解Yii2高级版引入bootstrap.js的一个办法
2017/03/21 PHP
Laravel关系模型指定条件查询方法
2019/10/10 PHP
javascript实现文字图片上下滚动的具体实例
2013/06/28 Javascript
JavaScript及jquey实现多个数组的合并操作
2014/09/06 Javascript
JavaScript实现把数字转换成中文
2015/06/29 Javascript
JS版元素周期表实现方法
2015/08/05 Javascript
JavaScript如何实现在文本框(密码框)输入提示语
2015/12/25 Javascript
jQuery实现点击行选中或取消CheckBox的方法
2016/08/01 Javascript
json与jsonp知识小结(推荐)
2016/08/16 Javascript
第一次动手实现bootstrap table分页效果
2016/09/22 Javascript
JavaScript prototype属性详解
2016/10/25 Javascript
使用vue框架 Ajax获取数据列表并用BootStrap显示出来
2017/04/24 Javascript
Flask中获取小程序Request数据的两种方法
2017/05/12 Javascript
JS实现身份证输入框的输入效果
2017/08/21 Javascript
jQuery实现文件编码成base64并通过AJAX上传的方法
2018/04/12 jQuery
基于mpvue的小程序项目搭建的步骤
2018/05/22 Javascript
微信小程序实现分享到朋友圈功能
2018/07/19 Javascript
详解JQuery基础动画操作
2019/04/12 jQuery
vue+express+jwt持久化登录的方法
2019/06/14 Javascript
layer.js之回调销毁对话框的例子
2019/09/11 Javascript
Js逆向实现滑动验证码图片还原的示例代码
2020/03/10 Javascript
[03:00]DOTA2-DPC中国联赛1月18日Recap集锦
2021/03/11 DOTA
python实现问号表达式(?)的方法
2013/11/27 Python
python如何通过protobuf实现rpc
2016/03/06 Python
Python语言实现百度语音识别API的使用实例
2017/12/13 Python
python调用外部程序的实操步骤
2019/03/04 Python
python实现堆排序的实例讲解
2020/02/21 Python
Pytorch上下采样函数--interpolate用法
2020/07/07 Python
Python pymsql模块的使用
2020/09/07 Python
李宁官方网店:中国运动品牌
2017/11/02 全球购物
主持词开场白
2014/03/17 职场文书
辞职信标准格式
2015/02/27 职场文书
vue实现无缝轮播效果(跑马灯)
2021/05/14 Vue.js
一次Mysql update sql不当引起的生产故障记录
2022/04/01 MySQL
mybatis 获取更新记录的id
2022/05/20 Java/Android