Jquery has been used for a long time, but it is used for current queries every time, or you can find related plug-ins. Never learned systematically. Javascript itself has a kind of fear. Although every time I read it carefully, I can't remember some things. It seems that the brain does not remember these related things. Recently, it took some time to finish reading jquery basics. It was clear that the code was well read. That is, when the phase is used, I forget it again. Is it old? I am 26. Although jquery in action is in English, it looks good. I accidentally saw the jquery real-site video from instructor Wang xingkui on the Internet. Suddenly open, and clear thinking. The instance mentioned in the video is displayed again in text format. It is only used for future queries. I am not good at words. Fixed by code and comments.
Demo name: Verify that the registered user name is available
Implementation: 1. When the button is pressed, you need to obtain the data in the text box, send it to the server, and finally accept the data returned by the server. Fill in the reserved Div to display the result.
2. When a key is pressed in the text box, you need to determine whether the content in the text box is empty. If it is not blank, the red border and background image will be removed; otherwise, the image will be retained.
The key to program writing is the idea. As long as the idea is correct, No matter what technology you use, you can implement it. This is why we need to think more before writing a program, rather than simply writing it. With the above ideas, we should first proceed with the first step: page design
Figure 1
As shown in 1, it is not difficult to achieve the above effect. First, we create the testdemo. aspx file. To achieve the above effect in the HTML file of this file, the Code is as follows:
Code
<Body>
After the above features are added to the page, it seems that the effect is not as expected. We also need to process the textbox style through CSS styles to achieve the following idea:
1. Set the border of textbox to 1px and the color to red.
2. Use a background image to display the image at the lower end of the screen.
3. Add the following code to HTML to introduce the style:
<LINK rel = "stylesheet" href = "CSS/testcss.css" type = "text/CSS" Media = "screen"/>
Create a testcss.css style file:
Code
. Usertext {
After the above files are completed, the effect of 1 is displayed after compilation and running. Follow the established ideas to further improve the verification function.
1. first introduce the jquery. js file in HTML to introduce the required class library, and create a vailty. js file for compiling jquery-related code.
Code
<SCRIPT type = "text/JavaScript" src = "jscript/jquery. js"> </SCRIPT>
The vailty. js code is as follows:
Code
// Register these tasks after loading on the page
According to our original ideas, the above generation has met our requirements, because I am in ASP.. NET platform development, so we need to create a file defualtverity. the aspx file is used to process server requests. Here we only write some symbolic code. Complete functions. Add the following code to page_load of defualtverity. aspx:
Code
String username = request. querystring ["username"]. tostring ();
If you want to scale it out, add some operations to access the database here.
In this way, a program with the verification function is completed using jquery. Although it is very simple, it is helpful for understanding jquery code. The test passes in IE7 and Firefox respectively. We recommend that you install multiple browsers to test the measurement process. At the same time, it is necessary to thoroughly learn how to install the firebug component in Js. It not only helps us with breakpoint debugging, but also helps us understand the concepts of selector and Dom in jquery. For specific operation methods, refer to the Javascript debugging tool: firebug Usage Details
Author: mzoylee
Source: http://blog.csdn.net/mzoy
The copyright of this article is shared by the author and the blog. You are welcome to repost this article, but you must keep this statement without the author's consent and provide a connection to the original article on the article page.
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
