首頁 > web前端 > js教程 > AJAX使用者如何登入後跳轉頁面? ajax用戶跳轉頁面的解釋(附實例)

AJAX使用者如何登入後跳轉頁面? ajax用戶跳轉頁面的解釋(附實例)

寻∝梦
發布: 2018-09-10 14:04:00
原創
12648 人瀏覽過

本篇文章主要的介紹了關於ajax用戶登入後跳轉的情況,下面有詳細的程式碼實例,有需要的朋友趕緊看過來。現在就開始本篇文章的介紹吧

最近在學習TP框架的使用,在做後台管理系統的時候做了個後台登錄頁面,想實時的提示用戶輸入信息的返回情況

AJAX使用者如何登入後跳轉頁面? ajax用戶跳轉頁面的解釋(附實例)

當然判斷同戶名稱密碼錯誤要經過後台驗證並且不刷新的情況下顯示在頁面上,那麼首先就想到非同步處理(這是門藝術)

TP上的$this_ajaxReturn();方法就可以將資訊傳回前段,並用jq判斷局部刷新出對應的資訊。

但是當我真正的輸入正確的使用者名稱密碼時卻無法跳到後台管理頁面只是傳回一條json資料流

AJAX使用者如何登入後跳轉頁面? ajax用戶跳轉頁面的解釋(附實例)

AJAX使用者如何登入後跳轉頁面? ajax用戶跳轉頁面的解釋(附實例)

原來使用非同步在收到後台回傳資料的時候,交給js程式碼處理,回到json流,那麼後台的重定向就進入了流裡面,而不會刷新出頁面,只能透過收到的相應看到頁面資訊。 (想看更多就到PHP中文網AJAX開發手冊欄位中學習)

那麼我們知道在js裡面處理那麼就可以用js的重定向Windows.location .href='url';跳到指定頁面

js程式碼

$(function(){
    $('button').click(function(){
        var user = $('input[name=user]');        var pwd = $('input[name=pwd]');        var verify = $('input[name=verify]');        if(user.val() == ''|| pwd.val() == '')
        {
            $('[name=user]').focus();
            $(&#39;#errormsg&#39;).html("<strong>用户名或密码不能为空<strong>");            return false;
        }        else if(verify.val() == &#39;&#39;) 
        {
            $(&#39;#errormsg&#39;).html("<strong>验证码不能为空<strong>");            return false;

        }        else{

           $.ajax({
                    url: handle,
                    data:{&#39;user&#39;:user.val(),&#39;pwd&#39;:pwd.val(),&#39;verify&#39;:verify.val()},
                    type: "POST",
                    dataType:&#39;json&#39;,
                    success:function(data){
                            if(data.status == &#39;1&#39;){
                             window.location.href = dr;
                            }                            else if (data.status == &#39;2&#39;) {
                               $(&#39;#errormsg&#39;).html("<strong>验证码错误<strong>");
                            }else if (data.status == &#39;0&#39;) {
                                $(&#39;#errormsg&#39;).html("<strong>用户名或密码错误!<strong>");
                            }
                        }, 
                        error : function(data) {
                            alert("出错:" + data.code);
                        }                  
                    });
            }
    });
})
登入後複製

後台程式碼

$verify = I(&#39;verify&#39;,&#39;&#39;,&#39;md5&#39;);        if($verify !== $_SESSION[&#39;verify&#39;])
            {                $this->ajaxReturn(array(&#39;status&#39; =>&#39;2&#39;));                die();
            }        $username=I(&#39;user&#39;,&#39;&#39;,&#39;&#39;);        $passward=I(&#39;pwd&#39;,&#39;&#39;,&#39;&#39;);        $date=M(&#39;admin&#39;,NULL);        $date->where(array(&#39;username&#39; => $username))->find();        if($date and $date->passward == $passward)
        {            $id = $date->id;            $login_time = time() ;            $login_ip = get_client_ip();            $date = array(&#39;id&#39; => $id,&#39;login_ip&#39; => $login_ip,&#39;login_time&#39; => $login_time );
            M(&#39;admin&#39;)->save($date);
            session(&#39;uid&#39;,$date[&#39;id&#39;]);
            session(&#39;ip&#39;,$date[&#39;login_ip&#39;]);            // $this->ajaxReturn(array(&#39;status&#39; =>&#39;1&#39;));
            // $this->success(&#39;登陆成功&#39;,U(&#39;Admin/Admin/index&#39;));
        }        else
        {            $this->ajaxReturn(array(&#39;status&#39; =>&#39;0&#39;));            $this->redirect(&#39;Admin/Index/index&#39;);
        }
    }
登入後複製

#以上也有接受後台資料判斷使用者名稱密碼是否正確的流程

這篇文章到這就結束了(想看更多就到PHP中文網 AJAX使用手冊欄位中學習),有問題的可以在下方留言提問。

以上是AJAX使用者如何登入後跳轉頁面? ajax用戶跳轉頁面的解釋(附實例)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板