美文网首页
4.利用ajax实现登录验证

4.利用ajax实现登录验证

作者: 梦想秀 | 来源:发表于2016-06-14 21:38 被阅读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.这种方法就是写死的     可以和数据库连接   对比数据库里的用户名和密码(下节讲解)

    相关文章

      网友评论

          本文标题:4.利用ajax实现登录验证

          本文链接:https://www.haomeiwen.com/subject/vzmudttx.html