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 }
运行效果和上面一样;
原创文章,转载请说明出处,谢谢合作
标签:
JQuery、Ajax
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 单元测试从入门到精通
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律