基于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中关于Ajax的几个常用的函数
Jul 17 jQuery
jQuery Layer弹出层传值到父页面的实现代码
Aug 17 jQuery
详解webpack3如何正确引用并使用jQuery库
Aug 26 jQuery
jQuery中.attr()和.data()的区别分析
Sep 03 jQuery
jquery实现企业定位式导航效果
Jan 01 jQuery
jQuery中each方法的使用详解
Mar 18 jQuery
JQuery通过后台获取数据遍历到前台的方法
Aug 13 jQuery
jQuery滑动效果实现方法分析
Sep 05 jQuery
JQuery中DOM节点的操作与访问方法实例分析
Dec 23 jQuery
jQuery实现评论模块
Aug 19 jQuery
如何使用jQuery操作Cookies方法解析
Sep 08 jQuery
jquery实现图片放大镜效果
Dec 23 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实现的简单美国商品税计算函数
2015/07/13 PHP
php实现的操作excel类详解
2016/01/15 PHP
Yii2 GridView实现列表页直接修改数据的方法
2016/05/16 PHP
PHP面向对象程序设计__tostring()和__invoke()用法分析
2019/06/12 PHP
Laravel 6 将新增为指定队列任务设置中间件的功能
2019/08/06 PHP
PHP call_user_func和call_user_func_array函数的简单理解与应用分析
2019/11/25 PHP
用javascript将数据导入Excel示例代码
2014/09/10 Javascript
js通过location.search来获取页面传来的参数
2014/09/11 Javascript
js中的json对象详细介绍
2014/10/29 Javascript
JS正则截取两个字符串之间及字符串前后内容的方法
2017/01/06 Javascript
jquery——九宫格大转盘抽奖实例
2017/01/16 Javascript
Vuex模块化实现待办事项的状态管理
2017/03/15 Javascript
详解vue过滤器在v2.0版本用法
2017/06/01 Javascript
Angular2使用vscode断点调试ts文件的方法
2017/12/13 Javascript
微信小程序中的canvas 文字断行和省略号显示功能的处理方法
2018/11/14 Javascript
JavaScript代码调试方法实例小结
2019/01/05 Javascript
vue组件间的参数传递实例详解
2019/04/26 Javascript
基于vue实现圆形菜单栏组件
2019/07/05 Javascript
ES5新增数组的实现方法
2020/05/12 Javascript
通过angular CDK实现页面元素拖放的步骤详解
2020/07/01 Javascript
详解JavaScript 中的批处理和缓存
2020/11/19 Javascript
python结合opencv实现人脸检测与跟踪
2015/06/08 Python
Python常见工厂函数用法示例
2018/03/21 Python
python绘制漏斗图步骤详解
2019/03/04 Python
python实现批量nii文件转换为png图像
2019/07/18 Python
pycharm中显示CSS提示的知识点总结
2019/07/29 Python
python线性插值解析
2020/07/05 Python
AmazeUI导航的示例代码
2020/08/14 HTML / CSS
中国宠物用品商城:E宠商城
2016/08/27 全球购物
如何实现jdbc性能优化
2012/07/30 面试题
公司道歉信范文
2014/01/09 职场文书
公司年会抽奖活动主持词
2014/03/31 职场文书
公司委托书范本
2014/04/04 职场文书
仓库保管员岗位职责
2015/02/09 职场文书
员工离职通知函
2015/04/25 职场文书
关于 Python json中load和loads区别
2021/11/07 Python