JQuery的Ajax实现注册检测用户名

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

(Asynchronous

Javascript

And

Xml) :异步的

Google创新的一种js技术

 

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

复制代码
 1  //核对用户名是否可用
 2         var xmlhttp = null;
 3 
 4         function checkUser(userName) {
 5             if (xmlhttp == null) {
 6                 xmlhttp = new XMLHttpRequest();//第一步:创建一步通信对象
 7             }
 8             //第二步:设定回调函数
 9             xmlhttp.onreadystatechange = function () {
10                 if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
11                     $("#tip").html(xmlhttp.responseText);
12                 }
13             }
14             xmlhttp.open("get", "register?op=check&userName=" + userName);
15             xmlhttp.send();
16         }
复制代码

 

 

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

方法二:JQuery的Ajax:

复制代码
 1    //核对用户名是否可用
 2         function checkUser(userName) {
 3             $.ajax({
 4                 type: 'post',//如果是get可以不写type,默认是get
 5                 url: "register",//action方式
 6                 data: {op: 'check', userName: userName}, //参数,如果参数多,可用date后跟一个大括号
 7                 success: function (res) {//回调函数
 8                     if (res.indexOf("yes") !== -1) {
 9                         $("#tip").html("Yes! Available: user name!");//可用
10                         //$("#tj").prop("disabled", false); //设置按钮可用
11 
12                     } else {
13                         $("#tip").html("No! User name: not available!");//不可用
14                         // $("#tj").prop("disabled", true); //设置按钮不可用
15                     }
16 
17                 }
18             });
19         }
复制代码

运行效果和上面一样; 

posted @   勤快的懒羊羊  阅读(414)  评论(0编辑  收藏  举报
编辑推荐:
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
点击右上角即可分享
微信分享提示