Jquery learning Notes use jquery to achieve no refreshing Logon

Now, let's take a look at how to use jquery to achieve no refreshing logon.
First, create the html section
Copy codeThe Code is as follows:
<Table>
<Tr>
<Td>
User name:
</Td>
<Td>
<Input type = "text" id = "username"/>
</Td>
</Tr>
<Tr>
<Td>
Password:
</Td>
<Td>
<Input type = "text" id = "password"/>
</Td>
</Tr>
<Tr>
<Td>
Verification Code:
</Td>
<Td>
<Input type = "text" id = "cord"/>

</Td>
</Tr>
<Tr>
<Td>
<Input type = "button" onclick = "login ();" value = "login"/>
</Td>
<Td>
</Td>
</Tr>
</Table>

The following features are available: login verification. Click to change the verification code. There is nothing to say about this.
The following is the jquery part.
Copy codeThe Code is as follows:
<Script src = "Scripts/jquery-1.4.1.min.js" type = "text/javascript"> </script> ----------- don't forget to reference this link, otherwise jquery cannot use
<Script type = "text/javascript">
// Use jquery for non-refreshing login verification
Function login (){
$. Ajax ({
Url: 'login. ashx', // access path
Data: 'username = '+ $ ("# username "). val () + "& password =" + $ ("# password "). val () + "& cord =" + $ ("# cord "). val (), // parameters to be verified
Type: 'post', // method of passing values
Error: function () {// function called when access fails
Alert ("link server error! ");
},
Success: function (msg) {// The function called when the access is successful. The msg here is the value returned by Login. ashx.
Alert (msg );
}
});
}
// Verification Code Image
$ (Function (){
$ ("# Username"). focus ();
$ ("# Checkcord"). click (function (){
$ ("# Checkcord"). attr ("src", "img. ashx? Time = "+ new Date ());
});
})
</Script>

This is probably the core code. When a user clicks the login button, the Login event is triggered and jquery is used to send logs to login. ashx sends a request in Login. in ashx, it only verifies whether the user name and password match and whether the verification code is correct. Login. ashx is written in C #. If you are learning other languages, you can change the address to another one.
Img. ashx is a program for generating verification codes. Every time you click an image, it will re-access img. ashx, so the image is replaced. When the image is generated, the session storing the verification code will be generated in Login. in ashx, you can determine whether the user input value is the same as the session value. Here I only show the main source code.
Copy codeThe Code is as follows:
Context. Response. ContentType = "text/plain ";
String username = context. Request. Form ["username"];
String password = context. Request. Form ["password"];
String cord = context. Request. Form ["cord"];
If (context. Session ["cord"]! = Null)
{
If (context. Session ["cord"]. ToString () = cord)
{
If (username = "admin" & password = "admin ")
{
Context. Response. Write ("Logon successful! ");
}
Else
{
Context. Response. Write ("Logon Failed! Incorrect username and password! ");
}
}
Else
{
Context. Response. Write ("Verification code error! ");
}
}

This is the logon code.
Well, the above is the core code. I hope you can give me more advice. I also hope my notes will be useful to you.