Add event listener to Iframe

Asked Jul 11 '17 at 13:30

Active Jul 11 '17 at 13:37

Viewed 28 times

When the IFrame loads this code attaches 'click' event to 'a' tag.

            function AddEventListenerToFrame(iframe) 
            {
                var frame = $(iframe).get(0).contentDocument;
                $('a', frame).click(function (event) {
                    $(this).attr("target", "_blank");
                });
            }

This works fine. But when the user clicks on the rendered menu and new partial is rendered, the clicks does not work anymore.

So, the issue is : event does not work on the new elements.

How to attach the same event for new rendered content ??

edited Jul 11 '17 at 13:34

asked Jul 11 '17 at 13:30

Bob Swager

`But when the user clicks on the rendered menu and new partial is rendered` so you mean the event does not work on the new elements... correct ? – Rajshekar Reddy Jul 11 '17 at 13:31
Yes. That's right. I edited my question. – Bob Swager Jul 11 '17 at 13:33
have you tried using - ` $(frame).on('click','a',function (event) { $(this).attr("target", "_blank"); });` – Jithin Raj P R Jul 11 '17 at 13:36
@JithinRajPR what's that ? – Bob Swager Jul 11 '17 at 13:36
2

well of course it will not bind because the elements are new. Code does not magically run. Either you need to rebind or event delegation.... – epascarello Jul 11 '17 at 13:39
Yes. That's clear. Do you have any idea how to add event listener to the new-rendered elements ? – Bob Swager Jul 11 '17 at 13:40
you can use on method in jquery....that works with newly added elements also – MukulSharma Jul 11 '17 at 13:42
@MukulSharma can you provide some example/link ? – Bob Swager Jul 11 '17 at 13:42
Go through this -https://learn.jquery.com/events/event-delegation/ – MukulSharma Jul 11 '17 at 13:44
@BobSwager - what type of elements u are adding dynamically? – MukulSharma Jul 11 '17 at 13:45
@MukulSharma partial views. I make it work. This way : `var frame = $(iframe).get(0).contentDocument; $(frame).on('click', 'a', function () { ` – Bob Swager Jul 11 '17 at 13:48
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/148906/discussion-between-mukulsharma-and-bob-swager). – MukulSharma Jul 11 '17 at 13:52
I solved my problem :) Enjoy ;) – Bob Swager Jul 11 '17 at 13:59

Add event listener to Iframe

0 Answers0