why does this text input not cache?

I have two web pages which work basically the same, code-wise, but one of them does not seem to cache information. By 'cache', I mean on the client/browser side. The text field does not retain previously entered information. In the first example below, if you register and then log in, the next time you log in, your username will be cached in the the browser to be selected; while in the second example, it does not retain that info.

http://www.dixieandtheninjas.net/hunter/ has a login prompt. once you've logged in once from a browser, when you revisit the page it has cached your username.

http://www.dixieandtheninjas.net/dynasties/ also has a login prompt, but it does not cache! And I cannot figure out why.

Perhaps because the second one is not within FORM tags? Maybe there's some other tiny coding mistake I've made which causes this.

Here's the code from the first example:

<form method = "post"
  action = "">

Username: <input type="text" name="login_name" value="" />
<br><br>
Password: <input type="password" name="password" value="" />
<br><br>
<input type="submit" value="Login" />
</form>

Here is code from the second example: Note that the clicks are handled by jquery in the second example, while the first just uses pure html and php

<p>
Email address: <input type="text" id="logininfo" value="" />
<br>
Password: <input type="password" id="password" value="" 开发者_如何学Go/>
<br>

<input type="button" id="loginbutton" value="Login" />
</p>

Here is the jquery used in the second example:

    <script type ="text/javascript">
        $(function(){


        $('#loginbutton').click(function(){
            var loginvar = $('#logininfo').val();
            var passvar = $('#password').val();



            //alert(loginvar + ", " + passvar);

            if (loginvar != '' && passvar != '') {

                var subdata = {
                   logindata : loginvar,
                   passdata : passvar
               };


           $.ajax({
            url: "index_backend.php",
            type: 'POST',
            data: subdata,

                success: function(result) {
                    //alert(result);
                    if (result == '1') {
                        // success
                        window.location.replace("http://www.dixieandtheninjas.net/dynasties/playermenu.php")
                    } else if (result == '2') {
                        //$('#logininfo').empty();
                        $('#logininfo').attr('value', '')
                        $('#password').attr('value', '')
                        alert("Login failed.  Please try again, or register if you have not already created an account.");
                    } else {
                        alert("Something has gone wrong!");
                        alert (result);
                    }
                } // end success
           });  // end ajax

            } else {
                alert ("Please enter a username and password.");
            }

        });   /// end click function for button



        });   //// end

        </script>

Since you aren't truly submitting the form in the jQuery one, the browser doesn't know that the user has attempted to use this as input vs just typed something in and then went to another page. Because of that, you won't be seeing it in the stored form data.