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 UI Grid 模态框中的表格实例代码
Apr 01 jQuery
jQuery操作css样式
May 15 jQuery
JQuery 封装 Ajax 常用方法(推荐)
May 21 jQuery
jQuery实现上传图片前预览效果功能
Aug 03 jQuery
jQuery实现腾讯信用界面(自制刻度尺)样式
Aug 15 jQuery
jQuery实现锚点向下平滑滚动特效示例
Aug 29 jQuery
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 jQuery
基于jQuery实现定位导航位置效果
Nov 15 jQuery
jQuery实现简单的下拉菜单导航功能示例
Dec 07 jQuery
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
jQuery实现的五星点评功能【案例】
Feb 18 jQuery
jquery.pager.js实现分页效果
Jul 29 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
PHP环境搭建最新方法
2006/09/05 PHP
header中Content-Disposition的作用与使用方法
2012/06/13 PHP
Gambit vs CL BO3 第一场 2.13
2021/03/10 DOTA
js jquery做的图片连续滚动代码
2008/01/06 Javascript
基于jquery的获取浏览器窗口大小的代码
2011/03/28 Javascript
js在数组中删除重复的元素自保留一个(两种实现思路)
2014/08/22 Javascript
关注jquery技巧提高jquery技能(前端开发必学)
2015/11/02 Javascript
JavaScript实现简单的tab选项卡切换
2016/01/05 Javascript
BootStrap初学者对弹出框和进度条的使用感觉
2016/06/27 Javascript
headjs实现网站并行加载但顺序执行JS
2016/11/29 Javascript
详解基于 Nuxt 的 Vue.js 服务端渲染实践
2017/10/24 Javascript
jQuery实现使用sort方法对json数据排序的方法
2018/04/17 jQuery
JS逻辑运算符短路操作实例分析
2018/07/09 Javascript
AngularJS实现的自定义过滤器简单示例
2019/02/02 Javascript
JavaScript中如何对多维数组(矩阵)去重的实现
2019/12/04 Javascript
JavaScript实现点击自制菜单效果
2021/02/02 Javascript
python中assert用法实例分析
2015/04/30 Python
Python MySQLdb Linux下安装笔记
2015/05/09 Python
Python 操作文件的基本方法总结
2017/08/10 Python
Python网络编程详解
2017/10/31 Python
JS设计模式之责任链模式实例详解
2018/02/03 Python
wtfPython—Python中一组有趣微妙的代码【收藏】
2018/08/31 Python
python hook监听事件详解
2018/10/25 Python
python自动循环定时开关机(非重启)测试
2019/08/26 Python
Python3安装pip工具的详细步骤
2019/10/14 Python
详解Python Opencv和PIL读取图像文件的差别
2019/12/27 Python
Python3.7黑帽编程之病毒篇(基础篇)
2020/02/04 Python
Java工程师面试集锦之Spring框架
2013/06/16 面试题
什么是makefile? 如何编写makefile?
2013/01/02 面试题
应届生骨科医生求职信
2013/10/31 职场文书
大学生新闻专业个人自我评价
2013/11/12 职场文书
生产车间主管岗位职责
2013/12/28 职场文书
请假条的格式
2014/04/11 职场文书
行政工作试用期自我评价
2014/09/14 职场文书
初中成绩单评语
2014/12/29 职场文书
nginx结合openssl实现https的方法
2021/07/25 Servers