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实现分页功能(含ajax请求、后台数据、附完整demo)
Apr 03 jQuery
jquery实现图片上传前本地预览
Apr 28 jQuery
jQuery树插件zTree使用方法详解
May 02 jQuery
基于jquery实现多选下拉列表
Aug 02 jQuery
jQuery EasyUI 折叠面板accordion的使用实例(分享)
Dec 25 jQuery
为jquery的ajax请求添加超时timeout时间的操作方法
Sep 04 jQuery
使用jQuery给Table动态增加行、清空table的方法
Sep 05 jQuery
jQuery动态操作表单示例【基于table表格】
Dec 06 jQuery
Jquery 获取相同NAME 或者id删除行操作
Aug 24 jQuery
如何在vue 中引入使用jquery
Nov 10 jQuery
jQuery实现动态操作table行
Nov 23 jQuery
jQuery class属性操作addClass()与removeClass()、hasClass()、toggleClass()
Mar 31 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的ob_start来生成静态页面的方法分析
2011/03/09 PHP
PHP大批量插入数据库的3种方法和速度对比
2014/07/08 PHP
PHP中模拟处理HTTP PUT请求的例子
2014/07/22 PHP
在PHP程序中使用Rust扩展的方法
2015/07/03 PHP
php验证码实现代码(3种)
2015/09/07 PHP
PHP实现无限极分类的两种方式示例【递归和引用方式】
2019/03/25 PHP
JavaScript 学习笔记(四)
2009/12/31 Javascript
JavaScript 轻松搞定快捷留言功能 只需一行代码
2010/04/01 Javascript
JQuery中关于jquery.js与jquery.min.js的比较探讨
2013/05/15 Javascript
JavaScript实现按照指定长度为数字前面补零输出的方法
2015/03/19 Javascript
jQuery实现自动滚动到页面顶端的方法
2015/05/22 Javascript
纯javascript实现四方向文本无缝滚动效果
2015/06/16 Javascript
Javascript常用小技巧汇总
2015/06/24 Javascript
js实现固定显示区域内自动缩放图片的方法
2015/07/18 Javascript
JS日期加减,日期运算代码
2015/11/05 Javascript
JavaScript中 this 指向问题深度解析
2017/02/21 Javascript
基于JavaScript实现五子棋游戏
2020/08/26 Javascript
echarts实现地图定时切换散点与多图表级联联动详解
2018/08/07 Javascript
js基础之事件捕获与冒泡原理
2019/10/09 Javascript
基于element-ui封装可搜索的懒加载tree组件的实现
2020/05/22 Javascript
使用Taro实现小程序商城的购物车功能模块的实例代码
2020/06/05 Javascript
vue 数据遍历筛选 过滤 排序的应用操作
2020/11/17 Javascript
python 编码规范整理
2018/05/05 Python
Django中反向生成models.py的实例讲解
2018/05/30 Python
Python读取英文文件并记录每个单词出现次数后降序输出示例
2018/06/28 Python
python 实现多维数组(array)排序
2020/02/28 Python
解决启动django,浏览器显示“服务器拒绝访问”的问题
2020/05/13 Python
Jupyter notebook如何修改平台字体
2020/05/13 Python
使用Python提取文本中含有特定字符串的方法示例
2020/12/09 Python
说一下mysql, oracle等常见数据库的分页实现方案
2012/09/29 面试题
Oracle快照(snapshot)
2015/03/13 面试题
机关干部四风问题自我剖析及整改措施
2014/10/26 职场文书
研究生就业推荐表导师评语
2014/12/31 职场文书
社交电商模式的兴起:这些新的商机千万别错过
2019/07/26 职场文书
Vue3.0中Ref与Reactive的区别示例详析
2021/07/07 Vue.js
Windows10安装Apache2.4的方法步骤
2022/06/25 Servers