Yes $("#dmid img", msg).each() is looping correctly.
I have a situation where depending on the user navigation, content
that is cached in the JavaScript object as a string is brought back
to the current document via:
$(selector).html(myObjc[index].page)
where myObjc[index].page is String containing html. So if I bind
events and after that store back in the myObj as String, all events
bound are lost and when I retrieve back into current dom ($
(selector).html(myObjc[index].page)) I have to rebind the events. So I
am assuming this is expected behavior as I can't see how events can
remain bound when that part of the DOM is stored as string in some js
object and replaced with fresh content. Correct me if I am wrong.
Actually I had to change img to imgg in this message post otherwise it
was being interpreted as html content and not being displayed in the
message.
I thought about event delegation but this would not work for me as
each event bound to each img has to store values via jquery event.data
object that are different for each image such as image width and
height which is actually overlay larger image witdh and height etc.
so when user hover on thumnail image, a larege image is display
overlayed on thumbnail. Again correct me if I am wrong.
On Mar 17, 1:28 am, James <james.gp....@gmail.com> wrote:
> 1) Are you sure that $("#dmid img", msg).each() is actually looping
> through all the elements you intended to loop through? Instead of
> doing a bind, try $(this).hide() to debug it. If it's not hiding the
> elements, it's not looping correctly. If it does hide, your event
> handler is not working correctly.
>
> 2) Is there a reason you're using <imgg... ? It's suppose to be <img
> But there are many advantages to using jQuery binding, such as:
> - you only code it once.
> - you separate code from markup, which keeps your page clean.
> If you have a lot of img tags, you might want to consider using Event
> Delegation. It lets you bind once to the img's parent element rather
> than X number of img tags (which is slow and more browser processer
> intensive).
>
> On Mar 14, 6:21 am, ulgold <ulg...@gmail.com> wrote:
>
> > When I try to bind events like within ajax call:
>
> > $.ajax({
> > type: 'POST',
> > ...........................
>
> > success: function(msg) {
>
> > $("#dmid img", msg).each ( function() {
>
> > $(this).bind('mouseover', handler)
> > ...............................
>
> > problem is the event is not bound unless I do something like:
> > $('#firstdiv').html(msg)
> > $("#dmid img").each ( function() {
> > $(this).bind('mouseover', handler)
>
> > Any idea why we cannot bind events when context is other than the
> > current loaded document?
>
> > Another question:
> > I have the option of writing onclick events within HTML page like:
>
> > <imgg src="" onclick=" return imghandler(event);" >
> > <imgg src="" onclick=" return imghandler(event);" >
> > <imgg src="" onclick=" return imghandler(event);" >
>
> > or using jquery to bind the onclick events above when the document has
> > loaded like
>
> > $("imgg").each ( function() {
> > $(this).bind('mouseover', imghandlerr)
>
> > }
>
> > Apart from the fact that the page size that is transported from the
> > server to the client is reduced when using jquery binding of events
> > ( due to missing hard coded onclick handlers in html), are there any
> > other advantages or disadvantages of either approach?
