Home > Developer > JavaScript
Basic jquery Information
Official jquery Website:Www.jquery.com
Jquery: jquery is a javascript class library that provides a large number of javascript class libraries and APIs to facilitate javascript development.
Jquery API Chinese Reference Manual:Http://jquery-api-zh-cn.googlecode.com/svn/trunk/index.html
The Foreground Data is submitted to the background demo:
Instance diagram:
Features:
1. Use $ ("# UserName") to obtain the jquery object whose id is UserName.
2. Use jquery's get, ajax, and load methods to submit data to the background.
3. Use the removeClass and addClass methods of jquery to modify the style.
4. encodeURI (username) transcode the string to prevent Chinese garbled characters. Be sure to use System. Web. HttpUtility. UrlDecode (str, encoding) decoding in the background.
Foreground html:
Copy codeThe Code is as follows:
<! 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 runat = "server">
<Title> </title>
<Script type = "text/jscript" src = "jquery-1.4.2.min.js"> </script>
<Style type = "text/css">
. NewStyle1
{
Border-top-style: 1;
Border-right-style: 1;
Border-bottom-style: 1;
Border-left-style: 1;
Border-color: # FF0000;
}
</Style>
<Script language = "javascript" type = "text/javascript">
// Called when the ready page is loaded
$ (Document). ready (function (){
// Register The onclick event of Btn_ajax
$ ("# Btn_ajax"). click (function (){
// Obtain the value of the text box
Var username = $ ("# UserName"). val ();
// Submit the result to the server. See the jquery help manual.
$. Ajax ({
Type: "GET ",
// The input text may be in Chinese and must be in the encodeURI format.
Url: "jquerydemo1.aspx? M = "+ encodeURI (username ),
Success: function (callbackmsg ){
$ ("# Usertext" ).html (callbackmsg );
}
});
})
// Register The onclick event of Btn_Get
$ ("# Btn_Get"). click (function (){
// Obtain the value of the text box
Var username = $ ("# UserName"). val ();
// Submit the result to the server. See the jquery help manual.
$. Get ("jquerydemo1.aspx? M = "+ encodeURI (username), null, function (callbackmsg ){
$ ("# Usertext" ).html (callbackmsg );
})
})
// Register The onclick event of Btn_Loadhtml
$ ("# Btn_Loadhtml"). click (function (){
// Obtain the value of the text box
Var username = $ ("# UserName"). val ();
// Submit the result to the server. See the jquery help manual.
$ ("# Usertext"). load ("HTMLPage1.htm", null, function (callbackmsg ){
$ ("# Usertext" ).html (callbackmsg );
})
})
// Register The onclick event of Btn_Loadquest
$ ("# Btn_Loadquest"). click (function (){
// Obtain the value of the text box
Var username = $ ("# UserName"). val ();
// Submit the result to the server. See the jquery help manual.
$ ("# Usertext"). load ("jquerydemo1.aspx? M = "+ encodeURI (username), null, function (callbackmsg ){
$ ("# Usertext" ).html (callbackmsg );
})
})
// Register the keyup event of UserName
$ ("# UserName"). keyup (function (){
// Remove the style if the value is not empty
Var value = $ (this). val ();
If (value! = ""){
$ (This). removeClass ("newStyle1 ")
}
Else {
$ (This). addClass ("newStyle1 ")
}
})
})
</Script>
</Head>
<Body>
<Form id = "form1" runat = "server">
<Div>
Enter the name: <input id = "UserName" type = "text" class = "newStyle1"/>
<Br/>
<Input id = "Btn_ajax" type = "button" value = "ajax check"/> <br/>
<Input id = "Btn_Get" type = "button" value = "Get check"/> <br/>
<Input id = "Btn_Loadhtml" type = "button" value = "Load loading html"/> <br/>
<Input id = "Btn_Loadquest" type = "button" value = "Load loading request"/> <br/>
<Div id = "usertext">
</Div>
</Div>
</Form>
</Body>
</Html>
Server code:
Copy codeThe Code is as follows:
Protected void Page_Load (object sender, EventArgs e)
{
If (HttpContext. Current. Request. QueryString ["m"]! = Null)
{
// Decodes the requested data through GB2312
String method = System. Web. HttpUtility. UrlDecode (HttpContext. Current. Request. QueryString ["m"], Encoding. GetEncoding ("GB2312 "));//
HttpContext. Current. Response. Write (method + "verified! ");
Response. End ();
}
}
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
