Ajax Authentication User Login and remember password

A person alone in charge of a project, just write down the technology that has not been achieved before, today, starting from the landing function, the front-end is JS verification, the back end is PHP script verification and added to remember the password function.

As you can see from the diagram above, the main technical point of the front-end is to verify the user name and password is entered and given a hint, in order to improve the user experience, the user entered the page, it will automatically focus on the user name input box, while in the Password input box binding a onkeypress event, that is, after the user entered the password, Press ENTER to complete the operation, of course. Ajax validation, and any validation error information appears on the User name input box (see below), and set a time limit of 3 seconds, that is 3 seconds after disappearing.

The following is the HTML code

                <form> <span class= "error_msg" ></span> <p CLA ss= "Pst_relative" > <label class= "input_msg" ></label><input type= "text" name= "use Rname "placeholder=" username "class=" login_input "maxlength=" > </p> <p C lass= "Pst_relative" > <label class= "input_msg" ></label><input type= "password" nam E= "passwd" placeholder= "password" onkeydown= "KeyDown" class= "Login_input" maxlength= "> &LT;/P&G"
                    T
                            <p class= "Clearfix" > <span class= "fl_left w_b60 psw_info" > <input type= "checkbox" id= "Remmberpwd" > <label for= "remmberpwd" > Remember password </label&gt
                        ; </span> <a class= "fl_right psw_info" href= "#" > Forgot password. </a>
                    </p> <p class= "Clearfix" > <input class= "fl _left btn btn_login "type= button" value= "Login   Record" > <a class= "fl_right Log_rega" href= "#" > Free Registration </a></p> </form>

The following JS code validation code

$ (function () {var height = $ (document). Height ();
    var bgheight = $ (". Login_bg"). Height ();

    $ (". Login_bg"). CSS ({"Height": Height + "px"});

    $ (". Error_msg"). Hide ();

    The default account input box gets the focus $ (' input[name=username] '). focusing ();
        Click to login $ ('. Btn_login '). Click (function () {var username = $.trim ($ (' input[name=username] '). Val ());
        var passwd = $.trim ($ (' input[name=passwd] '). Val ()); var remember = $ (' #remmberpwd '). Is (': Checked ')?
        1:0;
            if (username = = "") {$ (". Error_msg"). HTML (' Please fill in username ');
            $ (". Error_msg"). Show (). fadeout (2000);
            $ (' input[name=username] '). focus ();
        return false;
            ' Else if (passwd = = ') {$ ('. Error_msg '). html (' Please fill in password ');
            $ (". Error_msg"). Show (). fadeout (2000);
            $ (' input[name=passwd] '). focus ();
        return false; ///Asynchronous Submit $.post (' url ', ' username= ' + username + ' &password= ' + passwd + ' &remember= ' + remembEr, function (JSON) {//Validation failure if (Json.status = = 0) {$ (". Error_msg"). HTML (json.me
                Ssage);

            $ (". Error_msg"). Show (). fadeout (2000);
                Success} else {Console.log (' success ');
            Location.href = ';

}}, ' JSON ')});
    Judge return function KeyDown (e) {var e = e | | | event;
    if (e.keycode==13) {$ (". Btn_login"). Click (); }
}

Carefully read the next JS verification code, you should know that there is a remember variable, this is to remember the password, uploaded to the background, the PHP script by receiving the value, if the 1 instructions need to remember the password, where the technical point is mainly a method of Php Setcookie (string $name [ , string $value [, int $expire = 0 [, String $path [, String $domain [, bool $secure = False [, bool $httponly = false]]] ]], remember that the password takes advantage of the third parameter expire, then sets the expire associated expiration when the receive value is 1 o'clock, which is typically 1 days setcookie (' id ', 1,strtotime (' +1) '), and note that Since cookies are stored on the client side, the value of that ID should be encrypted, that is, the stored encryption, which is extracted based on the stored-time encryption rules. Remember the password, then the next time you log in, it can be written in the relevant methods

    Home Login Public
    function index () {

        if (IsLogin ()) {
            echo ' You have already login ';
        } else {
            $this-&G T;display ();
        }
    

See the above code should know IsLogin is to verify that the user has already remembered the password.

OK, just remember that, this point has passed, the project has a lot of no point, later have time to write.