时间:2021-07-01 10:21:17 帮助过:10人阅读
CSS
a{ text-decoration: none; } span{ cursor: default; } .root{ text-align: center; } .main{ width: 400px; height: 300px; background:#2eafe0; border: #f9bb48 2px solid; border-radius:20px; position: relative; margin: 200px auto 0; } .username,.password{ font-size: 30px; color:#b94242; } .uname,.pwd{ width: 200px; height: 40px; border: #e6ec6f 1px solid; border-radius: 8px; font-size: 25px; } #registcontent{ position: absolute; left:100px; top:152px; } #logincontent{ position: absolute; left:100px; top:152px; } .inputbox{ margin-top: 20px; } .btnbox{ margin-top: 30px; justify-content: space-around; } .button{ width: 200px; height: 45px; color: #f6f7dc; background: #e28003; border: #c7e02e 1px solid; font-size: 25px; border-radius:10px; cursor: pointer; position: absolute; left: 0; top: 0; } .tohref{ width: 200px; height: 20px; margin-top: 30px; position: absolute; left: 0; top: 40px; animation: href 1s 2s; } .href{ color: #ab2011; cursor: pointer; } .active{ display: none; } .animation{ animation: btn 1.5s; } @keyframes btn{ 0%{ top:-184px ; } 20%{ top:0 ; } 40%{ top: -100px; } 60%{ top: 0; } 80%{ top: -50px; } 100%{ top: 0; } } @keyframes href{ 0%{ top: 40px; transform: rotateY(-360deg); font-size: 20px; } 100%{ top: 40px; transform: rotateY(0deg); font-size: 16px; } }
JavaScript
window.onload = function (){ var regist = document.getElementById(‘registbtn‘); var login = document.getElementById(‘loginbtn‘); var tologin = document.getElementById(‘tologin‘); var toregist = document.getElementById(‘toregist‘); var logincontent = document.getElementById(‘logincontent‘); var registcontent = document.getElementById(‘registcontent‘); var loginbtn = document.getElementById(‘loginbtn‘); var registbtn = document.getElementById(‘registbtn‘); // 切换到登录按钮 tologin.onclick = function (){ logincontent.className = ‘btnbox‘; registcontent.className = ‘btnbox active‘; loginbtn.className = ‘button animation‘; registbtn.className = ‘button‘; } // 切换到注册按钮 toregist.onclick = function (){ logincontent.className = ‘btnbox active‘; registcontent.className = ‘btnbox‘; loginbtn.className = ‘button‘; registbtn.className = ‘button animation‘; } // 注册 regist.onclick = function (){ var registname = document.getElementById(‘login_uname‘).value; var registpwd = document.getElementById(‘login_pwd‘).value; var type = ‘regist‘; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘); } xhr.onreadystatechange = function (res){ if(xhr.readyState == 4 && xhr.status == 200){ alert(xhr.responseText); } } xhr.open(‘POST‘,‘index.php‘,true); xhr.setRequestHeader(‘Content-type‘,‘application/x-www-form-urlencoded‘); xhr.send(‘login_username=‘+registname+‘&login_password=‘+registpwd+‘&type=‘+type); } // 登录 login.onclick = function (){ var loginname = document.getElementById(‘login_uname‘).value; var loginpwd = document.getElementById(‘login_pwd‘).value; var type = ‘login‘; // alert(loginname); // alert(loginpwd); if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘); } xhr.onreadystatechange = function (res){ if(xhr.readyState == 4 && xhr.status == 200){ alert(xhr.responseText); } } xhr.open(‘POST‘,‘index.php‘,true); xhr.setRequestHeader(‘Content-type‘,‘application/x-www-form-urlencoded‘); xhr.send(‘login_username=‘+loginname+‘&login_password=‘+loginpwd+‘&type=‘+type); } }
PHP
<?php header(‘Content-type:text/html;charset:utf-8‘); // 服务器 $server = ‘localhost‘; // 用户名 $db_username = ‘root‘; // 密码 $db_password = ‘root‘; // 连接数据 $con = new mysqli($server,$db_username,$db_password); // var_dump($con); // 判断是否连接成功 if($con->connect_error){ die(‘数据库连接失败‘); } // 选择数据库 mysqli_select_db($con,‘adopey‘); // $registName=$_REQUEST[‘regist_username‘]; // $registPassword=$_REQUEST[‘regist_password‘]; $loginName=$_REQUEST[‘login_username‘]; $loginPassword=$_REQUEST[‘login_password‘]; $type=$_REQUEST[‘type‘]; // 注册 if($type==‘regist‘){ // 向表中插入注册信息 $registinfo = "insert into usera (uname,upwd) VALUES(‘$loginName‘,‘$loginPassword‘)"; mysqli_query($con,$registinfo); // 注册信息 echo ‘注册成功 用户名:‘.$loginName.‘ 密码:‘.$loginPassword; } // 注册部分结束 // 登录部分 if($type==‘login‘){ // 检查用户名和密码是否匹配 $check="SELECT * FROM usera WHERE uname=‘$loginName‘ and upwd=‘$loginPassword‘"; $login=mysqli_query($con,$check);//$login是obiect,是mysqli_result类型 // 把结果转换成数字类型,$login里面有个‘num_rows‘,值为0或1 $res=mysqli_num_rows($login);//判断是否为0 if($res){ echo $loginName.‘,您已登陆成功‘; }else{ echo ‘用户名或密码错误‘; } } // 关闭数据库 mysqli_close($con);
mysqli 简单的php注册登录功能
标签:xmlhttp 类型 styles pre die absolute char 有一个 The