[jQuery] Re: Alternative way of reacting to clicked link?
Alessandro,
>I have a page with about 12000 links in it. A few of these links point
>to anchors on the same page. A function should be called when those
>"intra page" links are clicked.
The bottom line is anything you do to parse 12,000 DOM objects on the same
page is going to be slow--even more so if each link would reside inside one
or more other elements.
While not unobtrusive, you'd be better off generated that content w/embedded
onclick events. You can still minimize the obtrusiveness of your code by
doing something like:
link
function clickHandler(el){
// do whatever you want w/the element reference
alert(el.href);
// prevent the href from happening
return false;
}
This seriously goes against the jQuery philosophy, but DOM parsing is just
sluggish when you have thousands of elements.
With all that said, I can't ever imagine why I'd need a page w/12,000 links
on it. It sure seems like you'd be better served by generated links
on-demand.
-Dan
[jQuery] Re: Alternative way of reacting to clicked link?
Hi, thanks for the suggestions. > While not unobtrusive, you'd be better off generated that content w/embedded > onclick events. > This seriously goes against the jQuery philosophy, but DOM parsing is just > sluggish when you have thousands of elements. I could live with not being 100% philosophy compliant with JQuery in order to have the pages working on all browsers. However, I cannot modify the HTML data (besides a few inclusions in the headers) and thus am forced to be unobtrusive. That's the perfect job for JQuery :) > With all that said, I can't ever imagine why I'd need a page w/12,000 links > on it. It sure seems like you'd be better served by generated links > on-demand. Those monster pages are generated references for an Application Library (for example http://doc.trolltech.com/4.3-snapshot/functions.html and http://doc.trolltech.com/4.3-snapshot/qwidget.html). Splitting up at least the first page and fixing the HTML will be done soon. But for now, I need to handle those pages. Alessandro
[jQuery] Re: Alternative way of reacting to clicked link?
Have you thought of starting with a blank page and filling it with ajax, then only showing the items based on the #name??? then you would only have to bind 1/26 of them at a time. On 4/23/07, Alessandro Portale <[EMAIL PROTECTED]> wrote: Hi, thanks for the suggestions. > While not unobtrusive, you'd be better off generated that content w/embedded > onclick events. > This seriously goes against the jQuery philosophy, but DOM parsing is just > sluggish when you have thousands of elements. I could live with not being 100% philosophy compliant with JQuery in order to have the pages working on all browsers. However, I cannot modify the HTML data (besides a few inclusions in the headers) and thus am forced to be unobtrusive. That's the perfect job for JQuery :) > With all that said, I can't ever imagine why I'd need a page w/12,000 links > on it. It sure seems like you'd be better served by generated links > on-demand. Those monster pages are generated references for an Application Library (for example http://doc.trolltech.com/4.3-snapshot/functions.html and http://doc.trolltech.com/4.3-snapshot/qwidget.html). Splitting up at least the first page and fixing the HTML will be done soon. But for now, I need to handle those pages. Alessandro -- Ⓙⓐⓚⓔ - יעקב ʝǡǩȩ ᎫᎪᏦᎬ
[jQuery] Re: Alternative way of reacting to clicked link?
I thought about splitting it on the server side at some point, later. A pure Ajax splitting sound like a good idea, I will think about that, thanks for the suggestion. But a page like http://doc.trolltech.com/4.3-snapshot/qwidget.html is hard to split and killing a few browsers with its 1100 internal of 1300 links if they are precessed via JQuery. That is a page I need an on-the-fly link handling for. On 24 Apr., 04:10, "Ⓙⓐⓚⓔ" <[EMAIL PROTECTED]> wrote: > Have you thought of starting with a blank page and filling it with ajax, > then only showing the items based on the #name??? then you would only have > to bind 1/26 of them at a time. Alessandro
[jQuery] Re: Alternative way of reacting to clicked link?
Bind the click element to the body, and let event delegation / bubbling do
its job. This way you have only one event listener. The function it runs can
then check the clicked element against a jQuery filter with .is() and run
stuff if necessary.
Im really busy now, so I'd just point you to check out something I wrote
earlier (considering rebinding stuff for ajax-loaded links, since this also
solves that):
http://groups.google.com/group/jquery-en/browse_thread/thread/da8d6815e14b93a3/14805d2432ed0a61?lnk=st&q=juha+suni+event+bubbling&rnum=2#14805d2432ed0a61
I'll gladly tell more if that doesn't help. That should however give you a
big performance boost, since at no point are you really looping through all
the DOM items, and their amount shouldn't really have an effect.
HTH
--
Suni
Alessandro Portale wrote:
> Hi,
>
> I have a page with about 12000 links in it. A few of these links point
> to anchors on the same page. A function should be called when those
> "intra page" links are clicked.
>
> $("[EMAIL PROTECTED]").click(...) seems to be too slow for some browsers on
> some machines if 12000 links need to be filtered.
>
> I hoped that $(window).click(...) could give me the possibility to
> handle the new window.location on-the-fly but unfortunately my bound
> function is called before the browser jumps to the anchor, so that
> window.location is still outdated.
>
> Does anybody know another way of on-the-fly reacting to a link click
> which allows to access the new url?
>
> Thanks in advance,
> Alessandro
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
"jQuery (English)" group.
To post to this group, send email to jquery-en@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/jquery-en?hl=en
-~--~~~~--~~--~--~---
[jQuery] Re: Alternative way of reacting to clicked link?
I think this is possible (never done it myself). 1. Bind a single click event to the entire document. 2. use event.target (sourceElement) to access the element that triggered the event. 3. Check if its one of your # links 4. do your magic. On Apr 24, 10:47 am, Alessandro Portale <[EMAIL PROTECTED]> wrote: > I thought about splitting it on the server side at some point, later. > A pure Ajax splitting sound like a good idea, I will think about that, > thanks for the suggestion. > > But a page likehttp://doc.trolltech.com/4.3-snapshot/qwidget.htmlis > hard to split and killing a few browsers with its 1100 internal of > 1300 links if they are precessed via JQuery. That is a page I need an > on-the-fly link handling for. > > On 24 Apr., 04:10, "Ⓙⓐⓚⓔ" <[EMAIL PROTECTED]> wrote: > > > Have you thought of starting with a blank page and filling it with ajax, > > then only showing the items based on the #name??? then you would only have > > to bind 1/26 of them at a time. > > Alessandro
[jQuery] Re: Alternative way of reacting to clicked link?
Thank You, Juha and Diego! Your suggestions work very well for me. I wasn't aware of the nice and useful information that I can get out if the event (.target). Now, it seems much faster, and I will test it on different OSes/Browsers. Best regards, Alessandro On Apr 24, 2:09 pm, "Juha Suni" <[EMAIL PROTECTED]> wrote: > Bind the click element to the body, and let event delegation / bubbling do > its job. This way you have only one event listener. The function it runs can > then check the clicked element against a jQuery filter with .is() and run > stuff if necessary. On Apr 24, 4:02 pm, "Diego A." <[EMAIL PROTECTED]> wrote: > I think this is possible (never done it myself). > 1. Bind a single click event to the entire document. > 2. use event.target (sourceElement) to access the element that > triggered the event. > 3. Check if its one of your # links > 4. do your magic. --~--~-~--~~~---~--~~ You received this message because you are subscribed to the Google Groups "jQuery (English)" group. To post to this group, send email to jquery-en@googlegroups.com To unsubscribe from this group, send email to [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/jquery-en?hl=en -~--~~~~--~~--~--~---
[jQuery] Re: Alternative way of reacting to clicked link?
I just did it.. it works as advertised! a single click bind and then referencing $(event.target) instead of $(this) Great idea Juha & Diego! I also tried to hover over the links, that didn't work very well! (I now know why) On 4/24/07, Diego A. <[EMAIL PROTECTED]> wrote: I think this is possible (never done it myself). 1. Bind a single click event to the entire document. 2. use event.target (sourceElement) to access the element that triggered the event. 3. Check if its one of your # links 4. do your magic. On Apr 24, 10:47 am, Alessandro Portale <[EMAIL PROTECTED]> wrote: > I thought about splitting it on the server side at some point, later. > A pure Ajax splitting sound like a good idea, I will think about that, > thanks for the suggestion. > > But a page likehttp://doc.trolltech.com/4.3-snapshot/qwidget.htmlis > hard to split and killing a few browsers with its 1100 internal of > 1300 links if they are precessed via JQuery. That is a page I need an > on-the-fly link handling for. > > On 24 Apr., 04:10, "Ⓙⓐⓚⓔ" <[EMAIL PROTECTED]> wrote: > > > Have you thought of starting with a blank page and filling it with ajax, > > then only showing the items based on the #name??? then you would only have > > to bind 1/26 of them at a time. > > Alessandro -- Ⓙⓐⓚⓔ - יעקב ʝǡǩȩ ᎫᎪᏦᎬ
[jQuery] Re: Alternative way of reacting to clicked link?
Hi.
> I hoped that $(window).click(...) could give me the
> possibility to handle the new window.location on-the-fly but
> unfortunately my bound function is called before the browser
> jumps to the anchor, so that window.location is still outdated.
In the abstract this can be a very good choice for "assigning" handlers.
If you're not used to doing it the syntax can be weird because you need
to look at the event object which you might not have used before. This
example isn't like yours exactly but could be a starting point:
document.getElementById('wrapper').onclick = function(e){
//e.target is for firefox. IE calls it something else.
if(e.target.nodeName=="LI"){
alert("you clicked on an LI");
}
};
Googling for event delegation will turn up more.
I've used this for pages with thousands of DOM elements for the
performance improvement. It can also make for a much more elegant
application design. Now that I know about this I look for opportunities
to use it, and am sometime very pleasantly surprised. I'm surprised
event delegation is not more widely used and understood
-->Nathan
> -Original Message-
> From: jquery-en@googlegroups.com
> [mailto:[EMAIL PROTECTED] On Behalf Of Alessandro Portale
> Sent: Monday, April 23, 2007 1:05 PM
> To: jQuery (English)
> Subject: [jQuery] Alternative way of reacting to clicked link?
>
>
> Hi,
>
> I have a page with about 12000 links in it. A few of these
> links point to anchors on the same page. A function should be
> called when those "intra page" links are clicked.
>
> $("[EMAIL PROTECTED]").click(...) seems to be too slow for some
> browsers on some machines if 12000 links need to be filtered.
>
> I hoped that $(window).click(...) could give me the
> possibility to handle the new window.location on-the-fly but
> unfortunately my bound function is called before the browser
> jumps to the anchor, so that window.location is still outdated.
>
> Does anybody know another way of on-the-fly reacting to a
> link click which allows to access the new url?
>
> Thanks in advance,
> Alessandro
>
[jQuery] Re: Alternative way of reacting to clicked link?
Thank you Diego A. and Juha Suni, your suggestions work very well :) I wasn't aware that it is possible to get such interesting things out of an event (.target). Now it is much faster and works better. After a few tests on different machines/ OSes/Browsers, this will be online. Best Regards, Alessandro On Apr 24, 4:02 pm, "Diego A." <[EMAIL PROTECTED]> wrote: > I think this is possible (never done it myself). > 1. Bind a single click event to the entire document. > 2. use event.target (sourceElement) to access the element that > triggered the event. > 3. Check if its one of your # links > 4. do your magic. On Apr 24, 2:09 pm, "Juha Suni" <[EMAIL PROTECTED]> wrote: > Bind the click element to the body, and let event delegation / bubbling do > its job. This way you have only one event listener. The function it runs can > then check the clicked element against a jQuery filter with .is() and run > stuff if necessary.
