JqueryAjax+php实现简单的注册登录

HTML结构

<div class="container">
			<form>  
			    <label>用户名</label>
			    	<input id="username" type="text" name="username" class="form-control" />  
			    <label>密码</label>
			    	<input id="password" type="password" name="password" class="form-control" />  
			    <button type="button" id="login" class="btn btn-primary">登录</button>  
			    <button type="button" id="sign" class="btn btn-danger">注册</button>  
			</form> 
			<div id="div"></div>
		</div>
前台JS

$("#login").click(function(){
				var sendData = {"username":$("#username").val(),"password":$("#password").val()}
				$.ajax({
					url:"action/login.php",
					type:"POST",
					data:sendData,
					success:function(data){
						if(data==1){
							$("#div").html("密码正确")
							
						}else if(data==2){
							$("#div").html("密码不正确")
						}else if(data==3){
							$("#div").html("账号不存在")
						}
					}
					
				})
			})
			$("#sign").click(function(){
				var sendData = {"username":$("#username").val(),"password":$("#password").val()}
				$.ajax({
					url:"action/addUser.php",
					type:"POST",
					data:sendData,
					success:function(data){
						if(data==1){
							$("#div").html("用户存在不能注册")
						}else if(data==2){
							$("#div").html("注册成功")
						}
					}
					
				})
			})
后台login.php

	$username = $_POST['username'];
	$password = $_POST['password'];
	$conn = mysqli_connect("localhost","root","","login") or die("连接失败");
	mysqli_query($conn,"set names utf8");
	$result = mysqli_query($conn,"select * from user where username='$username'");
	
	if($row=mysqli_fetch_array($result)){
		if($row["password"]==$password){
			echo 1;//密码正确
		}else{
			echo 2;//密码不正确
		}
	}else{
		echo 3;//账号不正确
	}
后台addUser.php

	$username = $_POST['username'];
	$password = $_POST['password'];
	$conn = mysqli_connect("localhost","root","","login") or die("连接失败");
	mysqli_query($conn,"set names utf8");
	$result = mysqli_query($conn,"select * from user where username='$username'");
	if($row=mysqli_fetch_array($result)){
		echo 1;//"用户存在不能注册"
	}else{
		mysqli_query($conn,"insert into `user` (`username`,`password`) values ('$username','$password')");
		echo 2;//注册成功
	}

希望能对新手玩家有点帮助。


好的,实现用户注册需要前端页面和后台接口,以下是一个简单的示例代码。 前端页面: ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>用户注册</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script> <script> $(function () { $("#register-btn").click(function () { var username = $("#username").val(); var password = $("#password").val(); var data = { "username": username, "password": password }; $.ajax({ type: "POST", url: "register.php", data: data, dataType: "json", success: function (result) { if (result.code == 0) { alert("注册成功!"); window.location.href = "login.html"; } else { alert(result.msg); } }, error: function () { alert("请求失败!"); } }); }); }); </script> </head> <body> <div> <label>用户名:</label> <input type="text" id="username" name="username" placeholder="请输入用户名"> </div> <div> <label>密码:</label> <input type="password" id="password" name="password" placeholder="请输入密码"> </div> <button id="register-btn">注册</button> </body> </html> ``` 后台接口(register.php): ```php <?php header('Content-Type: application/json; charset=utf-8'); $code = 1; $msg = "注册失败!"; if ($_SERVER["REQUEST_METHOD"] == "POST") { $username = $_POST["username"]; $password = $_POST["password"]; // 注册逻辑 // ... $code = 0; $msg = "注册成功!"; } $result = array( "code" => $code, "msg" => $msg ); echo json_encode($result); ?> ``` 说明: 1. 前端页面使用 jQuery 发送 POST 请求到后台接口,data 参数是一个 JSON 对象,包含用户名和密码。 2. 后台接口接收到 POST 请求后,获取用户名和密码,然后执行注册逻辑,这里只是一个简单的示例,实际开发中应该根据业务需求进行完善。 3. 注册成功后,后台接口返回 JSON 数据,包含 code 和 msg 两个字段,前端页面根据返回的 code 判断注册是否成功,如果成功则跳转到登录页面,否则弹出错误提示。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值