基于jQuery实现的Ajax 验证用户名唯一性实例代码


Posted in jQuery onJune 28, 2017

JSP部分代码:

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
  <%@include file="/common/header.jsp"%>
  <title>用户管理</title>
  <script type="text/javascript">
    function doVerify(){
      //获取界面的账号
      var account = $("#account").val();
      //获取账号后的提示信息文本
      var accountText = document.getElementById("accountText");
      //如果账号输入不为空,执行该方法
      if(account !=""){
        $.ajax({
          url:"${basePath}nsfw/userAction_verifyAccout.action",//后台查询验证的方法
          data:{"user.account": account},//携带的参数
          type: "post",
          success: function(msg){
            //根据后台返回前台的msg给提示信息加HTML
            if("true" !=msg){
              // 账号已经存在
              accountText.innerHTML = "<font color='red'>抱歉,"+account+"已被注册,请更换!</font>"
            }
            else{
              // 账号不存在
              accountText.innerHTML = "<font color='green'>恭喜,"+account+"可以注册!</font>"
            }
          }
        });
      }
    }
  </script>
</head>
<body class="rightBody">
<tr>
      <td class="tdBg" width="200px">帐号:</td>
      <td><s:textfield name="user.account" id="account" onchange="doVerify()"/>
        <span id="accountText"></span>
      </td>
    </tr>
</body>

后台代码:

public class UserDAOImpl extends BaseDaoImpl<User> implements UserDAO {
  /**
   * 校验账号唯一性
   */
  @Override
  public List<User> findObjectByAccountAndId(String id, String account) {
    StringBuilder hqlStr = new StringBuilder("FROM User t WHERE t.account = ?");
    if (StringUtils.isNotBlank(id)) {
      hqlStr.append(" AND t.id=?");
    }
    Query query = getSession().createQuery(hqlStr.toString());
    query.setParameter(0, account);
    if (StringUtils.isNotBlank(id)) {
      query.setParameter(1, id);
    }
    return query.list();
  }

效果图:

基于jQuery实现的Ajax 验证用户名唯一性实例代码

基于jQuery实现的Ajax 验证用户名唯一性实例代码

以上所述是小编给大家介绍的基于jQuery实现的Ajax 验证用户名唯一性实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery使用eraser.js插件实现擦除、刮刮卡效果的方法【附eraser.js下载】
Apr 28 jQuery
jquery dataTable 获取某行数据
May 05 jQuery
jQuery图片缩放插件smartZoom使用实例详解
Aug 25 jQuery
jquery插件开发之选项卡制作详解
Aug 30 jQuery
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 jQuery
基于jQuery解决ios10以上版本缩放问题
Nov 03 jQuery
jQuery实现点击DIV同时点击CheckBox,并为DIV上背景色的实例
Dec 18 jQuery
jQuery实现checkbox全选功能完整实例
Jul 12 jQuery
使用jquery模拟a标签的click事件无法实现跳转的解决
Dec 04 jQuery
jQuery实现简单弹幕效果
Nov 28 jQuery
jQuery单页面文字搜索插件jquery.fullsearch.js的使用方法
Feb 04 jQuery
如何在vue 中引入使用jquery
Nov 10 jQuery
jQuery、layer实现弹出层的打开、关闭功能
Jun 28 #jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 #jQuery
基于jQuery封装的分页组件
Jun 26 #jQuery
jQuery.Form实现Ajax上传文件同时设置headers的方法
Jun 26 #jQuery
jQuery实现一个简单的验证码功能
Jun 26 #jQuery
jQuery+C#实现参数RSA加密传输功能【附jsencrypt.js下载】
Jun 26 #jQuery
jQuery实现frame之间互通的方法
Jun 26 #jQuery
You might like
PHP 网页过期时间的控制代码
2009/06/29 PHP
php中通过Ajax如何实现异步文件上传的代码实例
2011/05/07 PHP
PHP连接SQLServer2005方法及代码
2013/12/26 PHP
php生成无限栏目树
2017/03/16 PHP
TP - 比RBAC更好的权限认证方式(Auth类认证)
2021/03/09 PHP
jquery ui dialog里调用datepicker的问题
2009/08/06 Javascript
jBox 2.3基于jquery的最新多功能对话框插件 常见使用问题解答
2011/11/10 Javascript
关于使用 jBox 对话框的提交不能弹出问题解决方法
2012/11/07 Javascript
jQuery根据表单name获取值的方法
2016/05/24 Javascript
AngularJS 作用域详解及示例代码
2016/08/17 Javascript
Angularjs使用指令做表单校验的方法
2017/03/31 Javascript
js实现拖拽上传图片功能
2017/08/01 Javascript
react高阶组件经典应用之权限控制详解
2017/09/07 Javascript
获取本机IP地址的实例(JavaScript / Node.js)
2017/11/24 Javascript
Vue-Router模式和钩子的用法
2018/02/28 Javascript
javascript中函数的写法实例代码详解
2018/10/28 Javascript
Vue实现仿iPhone悬浮球的示例代码
2020/03/13 Javascript
JavaScript 装逼指南(js另类写法)
2020/05/10 Javascript
Python中列表与元组的乘法操作示例
2018/02/10 Python
Python实现接受任意个数参数的函数方法
2018/04/21 Python
Python+OpenCv制作证件图片生成器的操作方法
2019/08/21 Python
Python检查图片是否损坏及图片类型是否正确过程详解
2019/09/30 Python
Django路由层URLconf作用及原理解析
2020/09/24 Python
Python tempfile模块生成临时文件和临时目录
2020/09/30 Python
详解CSS3 弹性布局快速入门
2019/06/06 HTML / CSS
现代家居用品及礼品:LBC Modern
2018/06/24 全球购物
专业销售业务员求职信
2013/11/18 职场文书
《金钱的魔力》教学反思
2014/02/24 职场文书
检讨书范文500字
2015/01/28 职场文书
2015年世界环境日活动总结
2015/02/11 职场文书
旷工辞退通知书
2015/04/17 职场文书
同学聚会通知短信
2015/04/20 职场文书
2016年社区创先争优活动总结
2016/04/05 职场文书
web前端之css水平居中代码解析
2021/05/20 HTML / CSS
python 爬取华为应用市场评论
2021/05/29 Python
使用Python解决图表与画布的间距问题
2022/04/11 Python