JQuery Ajax如何实现注册检测用户名


Posted in jQuery onSeptember 25, 2020

Ajax(无需等待直接向服务器发起请求)

(Asynchronous Javascript And Xml) :异步的

Google创新的一种js技术

方法一:比较原始没有封装的方法:

//核对用户名是否可用
    var xmlhttp = null;

    function checkUser(userName) {
      if (xmlhttp == null) {
        xmlhttp = new XMLHttpRequest();//第一步:创建一步通信对象
      }
      //第二步:设定回调函数
      xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
          $("#tip").html(xmlhttp.responseText);
        }
      }
      xmlhttp.open("get", "register?op=check&userName=" + userName);
      xmlhttp.send();
    }

JQuery Ajax如何实现注册检测用户名

从文本框中输入一个字符后就立即到数据库中查找该用户名是否存在,如果存在,提示不可用,直到可用为止;

方法二:JQuery的Ajax:

//核对用户名是否可用
    function checkUser(userName) {
      $.ajax({
        type: 'post',//如果是get可以不写type,默认是get
        url: "register",//action方式
        data: {op: 'check', userName: userName}, //参数,如果参数多,可用date后跟一个大括号
        success: function (res) {//回调函数
          if (res.indexOf("yes") !== -1) {
            $("#tip").html("Yes! Available: user name!");//可用
            //$("#tj").prop("disabled", false); //设置按钮可用

          } else {
            $("#tip").html("No! User name: not available!");//不可用
            // $("#tj").prop("disabled", true); //设置按钮不可用
          }

        }
      });
    }

运行效果和上面一样;

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件FusionWidgets实现的Bulb图效果示例【附demo源码下载】
Mar 23 jQuery
jquery仿京东商品放大浏览页面
Jun 06 jQuery
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
Aug 18 jQuery
jQuery简单实现对数组去重及排序操作实例
Oct 31 jQuery
jQuery实现DIV响应鼠标滑过由下向上展开效果示例【测试可用】
Apr 26 jQuery
jQuery实现获取动态添加的标签对象示例
Jun 28 jQuery
jQuery实现侧边栏隐藏与显示的方法详解
Dec 22 jQuery
JS/jQuery实现简单的开关灯效果【案例】
Feb 19 jQuery
使用jquery-easyui的布局layout写后台管理页面的代码详解
Jun 19 jQuery
Jquery动态列功能完整实例
Aug 30 jQuery
JQuery使用属性addClass、removeClass和toggleClass实现增加和删除类操作示例
Nov 18 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
jQuery实现带进度条的轮播图
Sep 13 #jQuery
jQuery实现鼠标拖拽登录框移动效果
Sep 13 #jQuery
jQuery实现简单全选框
Sep 13 #jQuery
jQuery+ajax实现用户登录验证
Sep 13 #jQuery
jquery实现简易验证插件封装
Sep 13 #jQuery
jQuery实现朋友圈查看图片
Sep 11 #jQuery
jQuery实现日历效果
Sep 11 #jQuery
You might like
长波知识介绍
2021/03/01 无线电
php打造属于自己的MVC框架
2012/03/07 PHP
php switch语句多个值匹配同一代码块应用示例
2014/07/29 PHP
PHP中使用break跳出多重循环代码实例
2015/01/21 PHP
php中的常用魔术方法汇总
2016/02/14 PHP
PHP观察者模式实例分析【对比JS观察者模式】
2019/05/22 PHP
laravel框架select2多选插件初始化默认选中项操作示例
2020/02/18 PHP
jQuery EasyUI API 中文文档 - Tree树使用介绍
2011/11/19 Javascript
原生JS绑定滑轮滚动事件兼容常见浏览器
2014/06/30 Javascript
js使用html()或text()方法获取设置p标签的显示的值
2014/08/01 Javascript
实例讲解JQuery中this和$(this)区别
2014/12/08 Javascript
jQuery qrcode生成二维码的方法
2016/04/03 Javascript
微信公众号-获取用户信息(网页授权获取)实现步骤
2016/10/21 Javascript
浅谈js对象属性 通过点(.) 和方括号([]) 的不同之处
2016/10/29 Javascript
微信小程序动态添加分享数据
2017/06/14 Javascript
详解Angular路由之路由守卫
2018/05/10 Javascript
ES6基础之 Promise 对象用法实例详解
2019/08/22 Javascript
微信小程序swiper左右扩展各显示一半代码实例
2019/12/05 Javascript
使用Typescript和ES模块发布Node模块的方法
2020/05/25 Javascript
python 环境变量和import模块导入方法(详解)
2017/07/11 Python
python学习笔记之列表(list)与元组(tuple)详解
2017/11/23 Python
pyqt5自定义信号实例解析
2018/01/31 Python
对Python 网络设备巡检脚本的实例讲解
2018/04/22 Python
python requests抓取one推送文字和图片代码实例
2019/11/04 Python
华为俄罗斯官方网上商城:购买Huawei手机和平板
2017/04/21 全球购物
培训主管的岗位职责
2013/11/23 职场文书
中专毕业生个人职业生涯规划
2014/02/19 职场文书
计算机应用专业毕业生求职信
2014/06/03 职场文书
2014年音乐教师工作总结
2014/12/03 职场文书
2014年班级工作总结范文
2014/12/23 职场文书
合作合同协议书范本
2015/01/27 职场文书
小学少先队工作总结2015
2015/05/26 职场文书
家属联谊会致辞
2015/07/31 职场文书
导游词之阳朔遇龙河
2019/12/16 职场文书
go语言中GOPATH GOROOT的作用和设置方式
2021/05/05 Golang
spring cloud eureka 服务启动失败的原因分析及解决方法
2022/03/17 Java/Android