Jquery entry [1]-Constructor
Jquery entry [2]-Selector
Jquery entry [3]-Events
Getting started with jquery [4]-chained code
Getting started with jquery [5]-Ajax
Jquery entry [6]-Animation
Jquery provides rich support for Ajax. For more information, see
The most basic element is $ Ajax (). with different parameters, this method supports various Ajax application scenarios. For example:
$. Ajax ({
URL: "test.html ",
Cache: false,
Success: function (HTML ){
$ ("# Results"). append (HTML );
}
});
For a complete list of parameters, see options.
Of course, these are commonly used:
Demo:
Create a generichandler for Ajax request server: cubehandler. ashx <% @ webhandler Language = "C #" class = "cubehandler" %>
Using system;
Using system. Web;
Public class cubehandler: ihttphandler {
Public void processrequest (httpcontext context ){
Context. response. contenttype = "text/plain ";
Int number = 0;
Int. tryparse (context. Request. Params ["Number"], out number );
Context. response. statuscode = 200;
Context. response. cache. setcacheability (httpcacheability. nocache );
Context. response. Write (string. Format ("{0} cubed is {1}", number, math. Pow (number, 3 )));
}
Public bool isreusable {
Get {
Return true;
}
}
}
Because request. Params is used, this handler supports both get and post. <! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<HTML xmlns = "http://www.w3.org/1999/xhtml">
<Head>
<Title> Ajax </title>
<SCRIPT src = "../scripts/jquery-1.2.3.intellisense.js" type = "text/JavaScript"> </SCRIPT>
<SCRIPT type = "text/JavaScript">
$ (Function (){
// Set the indicator
$ ('# Divindicator'). ajaxstart (function () {$ (this). Show ()})
. Ajaxsuccess (function () {$ (this). Hide ()})
. Ajaxerror (function (MSG) {$ (this). Hide (); alert (MSG );});
// Ajax GET request
$ ('# Btngetcubeinget'). Click (function (){
VaR number = $ ('# txtnumber'). Val ();
$. Get ('cubehandler. ashx? Number = '+ number, function (result ){
Alert (result );
});
});
// Ajax post submission
$ ('# Btngetcubeinpost'). Click (function (){
VaR number = $ ('# txtnumber'). Val ();
$. Get ('cubehandler. ashx', {'number': Number}, function (result ){
Alert (result );
});
});
});
</SCRIPT>
<Style type = "text/CSS">
. Indicator
{
Color: # ff0000;
Position: absolute;
Top: 0px;
Right: 0px;
Display: none;
}
</Style>
</Head>
<Body>
<Div id = "divindicator" class = "indicator">
loading </div>
Plz input a number: <input id = "txtnumber"/>
<Input type = "button" id = "btngetcubeinget" value = "Get cube (get)"/>
<Input type = "button" id = "btngetcubeinpost" value = "Get cube (post)"/>
</Body>
</Html>
Effect after clicking the button:
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
