How Login page is working in Jquery mobile?
<p>I made a login page, i got the jquery code Can anybody explain me this CODE!??
Line by line! so that i know how the hell it is working! i have the code but i dont know how its work.. i am not that good in service integration and stuff</p>

<pre><code>$(document).ready(function() {

        $('#loginForm').submit(function() {

            $('#output').html('Connecting....');

            var postTo = 'login.php';

            $.post(postTo,{username: $('[name=username]').val() , password: $('[name=password]').val()} , `

                function(data) {



                    if(data.message) {

                        $('#output').html(data.message);

                    } else {

                        $('#output').html('Could not connect');

                    }



                },'json');



            return false;

        });

    });
</code></pre>

<p>`
In my html :</p>

<pre><code>&lt;!-- Start of first page --&gt;
</code></pre>

<p></p>

<pre><code>&lt;div data-role="header"&gt;

    &lt;h1&gt;Foo&lt;/h1&gt;

&lt;/div&gt;&lt;!-- /header --&gt;



&lt;div data-role="content"&gt;   



    &lt;p id="output"&gt;&lt;/p&gt;

    &lt;p&gt;

        &lt;form method="post" id="loginForm"&gt;

            Username: &lt;input type="text" name="username"&gt;&lt;br /&gt;&lt;br /&gt;

            Password: &lt;input type="password" name="password"&gt;&lt;br /&gt;

            &lt;input type="submit" value="Login"&gt;

        &lt;/form&gt;

    &lt;/p&gt;



&lt;/div&gt;&lt;!-- /content --&gt;



&lt;div data-role="footer"&gt;

    &lt;h4&gt;Page Footer&lt;/h4&gt;

&lt;/div&gt;&lt;!-- /header --&gt;
</code></pre>

<p></p>

<p>I basically wanna know what $.post is doing? and how?</p>
