4.利用ajax实现登录验证

2016-06-14  本文已影响0人  梦想秀

1.在login.html中搭建框架  有用户名 密码  按钮

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8"/>

<title></title>

</head>

<body>

    用户名: <input type="text" name="user" id="user"><br/>

    密码:     <input type="password" name="pass" id="pass"><br/>

    <button id="getText">获取数据</button>

     <div id="div"></div>

</body>

<script src="ajax.js" type="text/javaScript" charset="utf-8"></script>

<script>

      var getText=document.getElementById("getText");

      var user = document.getElementById("user");

      var pass = document.getElementById("pass");

      var div1 = document.getElementById("div");

      getText.onclick=function(){

           var url="ajax-login.php?user="+user.value+"&pass"+pass.value+"";

           ajaxFn(url,succFn(data){

                   div1.innerHTML=data;

});

}

</script>

</html>

2.在ajax-login中通过用户传入的用户名和密码进行匹配

<?php

$user = $_GET["user"];

$pass = $_GET["pass"];

if($user == "karry" && $pass=="hello"){

          echo "登录成功";

}else{

           echo "登录失败";

}

?>

3.实现效果

随便输入一个用户名和密码

输入正确的

4.这种方法就是写死的     可以和数据库连接   对比数据库里的用户名和密码(下节讲解)

上一篇下一篇

猜你喜欢

热点阅读