Home > Web Front-end > JS Tutorial > How do AJAX users jump to the page after logging in? Explanation of ajax user jump page (with examples)

How do AJAX users jump to the page after logging in? Explanation of ajax user jump page (with examples)

寻∝梦
Release: 2018-09-10 14:04:00
Original
12648 people have browsed it

This article mainly introduces the situation of jump after ajax user logs in. There are detailed code examples below. Friends in need should quickly take a look. Let’s start the introduction of this article now

I have been learning the use of TP framework recently. When I was working on the backend management system, I made a backend login page. I wanted to prompt the user in real time about the return status of the input information.

How do AJAX users jump to the page after logging in? Explanation of ajax user jump page (with examples)

Of course, judging that the username and password are incorrect must go through background verification and be displayed on the page without refreshing, so the first thing to think about is asynchronous processing (this is the door Art)

The $this_ajaxReturn(); method on TP can return the information to the previous section, and use jq to judge the local refresh of the corresponding information.

But when I actually enter the correct username and password, I cannot jump to the background management page and just return a json data stream

How do AJAX users jump to the page after logging in? Explanation of ajax user jump page (with examples)

How do AJAX users jump to the page after logging in? Explanation of ajax user jump page (with examples)

It turns out that when asynchronous is used to receive the data returned from the background, it is handed over to the js code for processing and the json stream is returned. Then the background redirection enters the stream instead of The page will be refreshed, and the page information can only be seen through the received response. (If you want to see more, go to the PHP Chinese website AJAX Development Manual column to learn)

Then we know that it is processed in js, then we can use js to redirect Windows.location .href='url';Jump to the specified page

js code

$(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);
                        }                  
                    });
            }
    });
})
Copy after login

Backend 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;);
        }
    }
Copy after login

The above also has the process of accepting background data to determine whether the username and password are correct

This article ends here (if you want to see more, go to the PHP Chinese website Learn in the column of the AJAX User Manual). If you have any questions, you can leave a message below.

The above is the detailed content of How do AJAX users jump to the page after logging in? Explanation of ajax user jump page (with examples). For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template