jQuery对AJAX的封装——$.get(验证用户名是否存在)

来源:互联网 发布:windows pe 编辑:程序博客网 时间:2024/06/05 07:22

php:

<span style="font-size:18px;"><?php//判断客户端传递过来的用户名在数据库中是否已经存在,返回'exists'或'non-exists'header('Content-Type: text/plain');$db = ['tom', 'mary', 'king'];$uname = $_REQUEST['uname'];if( in_array($uname, $db) ){echo 'exists';}else {echo 'non-exists';}?></span>

html:

<span style="font-size:18px;"><!DOCTYPE html><html> <head>  <title> new document </title>  <meta charset="utf-8" /> </head> <body><h1>jQuery对AJAX的封装——$.get</h1><h3>异步验证用户名是否存在</h3>用户名:<input id="uname"><span id="unameMsg"></span><br>密码名:<input id="upwd"><br><input type="button" value="提交注册信息"><script src="js/jquery-1.11.3.js"></script><script>$('#uname').blur(function(){var uname = $(this).val();if(!uname){return;}//发起异步请求/*$.get('3-checkuname.php?uname='+uname,function(data, msg, xhr){console.log('成功得到服务器返回的响应消息');//console.log(arguments);if(data==='exists'){$('#unameMsg').html('该用户名已被占用!').css('color', 'red');}else {$('#unameMsg').html('该用户名可以使用!').css('color', 'green');}})*//*$.get('3-checkuname.php','uname='+uname,function(data, msg, xhr){console.log('成功得到服务器返回的响应消息');//console.log(arguments);if(data==='exists'){$('#unameMsg').html('该用户名已被占用!').css('color', 'red');}else {$('#unameMsg').html('该用户名可以使用!').css('color', 'green');}})*/var obj = {'uname':uname, age:20};$.get('3-checkuname.php',obj,function(data, msg, xhr){console.log('成功得到服务器返回的响应消息');//console.log(arguments);if(data==='exists'){$('#unameMsg').html('该用户名已被占用!').css('color', 'red');}else {$('#unameMsg').html('该用户名可以使用!').css('color', 'green');}})})</script> </body></html></span>


0 0
原创粉丝点击