Some of the jquery problems that beginners often encounter organize _jquery

Source: Internet
Author: User
Classyuan's blog.http://www.classyuan.com/. Some of the following are listed below:
1. When loading an event with an HTML element, the event is executed at the same time as it is loaded.
Error code:
Copy Code code as follows:
$ ("#btnLoad"). Bind ("click", GetProduct ());

Correct code
Copy Code code as follows:
$ ("#btnLoad"). Bind ("click", Function () {getproduct ()});

I'm ignoring the bind method in this code. The explanation for the API is bind (TYPE,[DATA],FN)
I mistakenly speak FN as a simple function. This will cause this piece of code to be executed once this FN is loaded.
This is a written form of negligence. The great God who wants to know the reason can guide.
2 problem with the scope of the variable. This is not a question of jquery. But the difference between JS and. Net. )
Copy Code code as follows:
function text () {
2 for (var i = 0; i < 3; i++) {
3 $ ("<a> delete </a>"). attr ({id: "hr_" + I, href: "javascript:;"}). AddClass ("Btncss"). Bind ("click", Function () {tes (i)}). Appendto (". Div_list");
4}
5}
6 function tes (ID) {
7 alert (ID);
8}

This function. I want him to alert the corresponding ID. Results.. The answer is quite agreeable. 3 functions for <a> tags. The bounce is 3.
Look at it. I see
The question of the scope of the variable, the parameter of the TES function is the value of I after the end of the loop, so all is 3.
This seems to be different from. Net.
Final Solution--.. Go straight. $ (this) passed in
3. Question of sequence of event execution
Copy Code code as follows:
<a target= "_blank" title= "Iphone" >
2
3 </a>

The OnClick event is bound to the image, which adds an href attribute to the tag's parent.
However, after the event has finished executing, it will jump directly to the a tag's link. After analysis.
The click should be executed before href, that is, when the image is clicked, a tag already has an href, and then a tag is triggered.
Solution ... Remove the outer label A. Then modify the event
Copy Code code as follows:
Idwrap (' <a href= ' http://www.baidu.com "></a>");

This is the first time I've had a problem with jquery for this novice. Stay here. As a process of growing up. Dear old birds of great God. Don't spray the acridine.

First question
$ (' #btnLoad '). Bind (' click ', getproduct);
Remember, binding events are tied to a function, and getproduct (), with parentheses, gets the return value of the function. And the return value of your getproduct is obviously not a function.
$ ("#btnLoad"). Bind ("click", GetProduct ());
To
$ ("#btnLoad"). Bind ("click", GetProduct);
Give it a try.
GetProduct () executes a function and then returns a value, but the value returned is not the FN type.

A second question
In fact. NET also has, this is the closure of the problem, in the closure is the address of the I variable, and I constantly changing, so access to this address after the value has been changed, so all the TES use i this variable last value, is 3
This problem is solved using the following method (I simplify the code below):
for (var i = 0; i < 3; i++) {
(function (i) {
$ (' <a> delete </a> '). Appendto ('. Div_list '). Bind (' click ', function () {tes (i);});
}) (i);
}
If you do not understand the principle of this writing, it does not matter, first remember this form, and then encounter similar problems in accordance with this idea to write, that is, the outer set of a layer (function () {XXX}) ();
When it comes to the original painting, it's really simple, when I pass a function, I as a basic type variable is passed by value, that is, I will copy the value of the current I to this function, so every time I call this anonymous function, I will be independent and not be affected by the outer for.

A third question
When a does not give the href attribute, href defaults to the address of the current page, so you'll jump when you click. So there are several ways to deal with the popular online
1.<a href= "###" >dfa</a>
2.<a href= "javascript:void ();" >dfa</a>
3.<a href= "javascript:;" >dfa</a>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.