ansaurus

Question

How to select an anchor element inside a div created at runtime with jquery?

Answer 1

+3 A:

No need to use .live(), that is for attaching events automatically to newly created elements.

$(a.theLink);

Will get you all of the elements of type a, with the class theLink.

Matthew Schinckel 2010-09-10 23:55:22

Just missing the quotation marks. ;)

Josh Leitzel 2010-09-10 23:56:26

This isn't an accurate description of `.live()` it doesn't attach handlers to new elements, it's a passive event listener. Also, your selector needs quotes :)

Nick Craver 2010-09-10 23:56:55

Answer 2

A:

You can use

$("a.theLink");

And if you are binding a event to these links, yes you must use live if page get new content after initial reload.

So, you can use:

$("a.theLink").live("click", function(){
    alert("clicked!");
});

Topera 2010-09-10 23:56:17

Answer 3

A:

It doesn't matter when they're created, and "live" is something completely different -- it's a tool for event handling / event delegation, not selectors.

$('a.theLink') or $('ul.menu a.theLink') or whatever (depending on whether you want to look globally) will work just fine.

hobbs 2010-09-10 23:56:18

Answer 4

+1 A:

If you only want to select them, all the posted solutions will work perfectly, but if you actually want to do stuff when they're being clicked, try this:

$("a.theLink").live("click", function(event){
    //do stuff
    event.preventDefault(); // Prevent default link behaviour
});

UPDATE

I speed-read the plugin source code and I saw that a bunch of .click() handlers do a return false (lines 28, 211, 304, etc). I am fairly new to the use of the .live() function, but from what I understand, and as somebody actually pointed already in a comment to your other question, .live() will NOT work on an element that already has a .click() handler which returns false. In the case of this particular plugin, I THINK that return false;is used for preventing repetitive behaviour, like re-opening the menu if is already open, but I could be way off.

Giving you a definitive answer to your problem is hard, mostly because it would require me to know that plug-in really good, which I obviously do not. However, for starters I would modify that plugin by commenting out/removing all the return false; lines from .click() handlers and see what gets fixed and what gets broken.

Please let me know if/how this works out.

FreekOne 2010-09-10 23:58:03

@FreekOne: Thank you very much for the time spent in helping on this issue. If you have a look on patrick comment at my question, you'll see that he had deeper look at the plugin and the issue would not be solved in any case. Anyway, lot of thanks!

Lorenzo 2010-09-11 14:28:26

@Lorenzo - No problem, I'm sorry it didn't work out tho.

FreekOne 2010-09-11 14:54:10

Answer 5

A:

jQuery will select from whatever is on the page at the time it runs. So it depends on how/where the jQuery function will be called.

For example, if you wanted to reference these links after they have been created, you would just use $('a.theLink') or $('ul.menu a.theLink') or etc.

If you wanted to set events to these elements before they are even created, then you would use live. Maybe something like below which would link up to the current a.theLink's and any a.theLink's that will be created in the future.

$('a.theLink').live('click', function() {
  // Live handler called.
});

http://api.jquery.com/live/

Mercurybullet 2010-09-11 00:01:19

ansaurus

tags:

views:

answers:

How to select an anchor element inside a div created at runtime with jquery?

related questions