The solution of Ajax using jquery based on ASP

Whether it is jquery or Ajax in today's discussion has been very backward, there is a lot of information on the Internet, but still a lot of novices are very confused. This article is the simplest way for beginners to demonstrate how to use jquery to implement AJAX technology (so this article is written for beginners, old birds do not spray, the great God omitted 10,000 words). As for what is jquery what is Ajax, go Google yourself.

Start by creating a new ASP. NET Web application named Ajax, as shown in the project directory.

where the. ashx file is a generic handler and you don't have to know what it is for the time being, you'll know it later.

Let's first clarify what we're going to do: The WebForm1 page makes a request to the Handler1 handler every second, HANDLER1 returns the data to the WebForm1 page, and the WebForm1 page implements the local refresh effect via Ajax technology.

First look at the main code of Handler1:

public void ProcessRequest (HttpContext context) {    random rand = new Random ();    int num = rand. Next (1,10);    Context. Response.Write (num);}

The main is to change the ProcessRequest method to the above appearance, resulting in a 1~9 random integer returned to the request page.

Then look at the main code of WebForm1.aspx:

<script type= "Text/javascript" src= "jquery/jquery-1.7.1.js" ></script><script type= "Text/javascript ">    $ (document). Ready (function () {        function get () {            $.ajax ({                type:" Post ",                URL:" Handler1.ashx ",                data:",                success:function (data) {                    $ ("#dataShow"). Text (data);}            });        }        SetInterval (get, +);    }) </script>

If we're going to use jquery, we're going to refer to the Jqury-1.7.1.js file we just downloaded, and the code below should be able to see it, okay? If this also can not understand, it must first to fill the foundation of JS.

Add such a code to the page:

<p id= "Datashow" ></p>

is used to display the data returned by the request Handler1.

Finished! Just so much! If normal, you can see in the browser a random change from 1 to 9 numbers, note that this is not the entire page refresh! If you do not believe, you can give the <p> tag a margin, let it show when the scroll bar appears above the browser height, if the data changes when the scrollbar does not return to the top of the description is a partial refresh.

For more advanced functions, readers are required to check the information themselves, which is a simple introductory article.