How to change iframe src by clicking a with jquery?

Question

My js file looks like this:

$('.button').live("click",function () { 
      $('.tresc').attr("src", "http://www.google.com/");
});

and html:

<a href="javascript:void(0)" class="button">Odnośnik 01</a>

I want to change iframe with class tresc src to for ex. "http://google.com", by clicking a with class button using jquery. My solution doesn't work anyway. Any advices?

Depending on your jQuery version.. `$.fn.live == 'undefined'` — MackieeE, Feb 09 '14 at 18:13
http://stackoverflow.com/questions/2930315/changing-iframe-source-with-jquery — AtanuCSE, Feb 09 '14 at 18:14
What is your actual problem?? Detecting click on a link or changing the source of iframe. Give a alert inside click function to see if click is working correctly. If possible make a jsFiddle. — AtanuCSE, Feb 09 '14 at 18:19

score 0 · Answer 1 · edited May 23 '17 at 10:25

There are a few issues. First, if the jQuery version is > 1.6 the code should use on to attach the event. It would also be a good idea to prevent the default event so that the code does not attempt to navigate to another page. Also, I would recommend switching to prop instead of attr.

This leaves us with:

$('.button').on("click",function (e) { 
      e.preventDefault();
      $('.tresc').prop("src", "http://www.google.com/");
});

However, this still will not work because the Google security settings prevent the page from being loaded within an iframe. See an explanation why here.

How to change iframe src by clicking a with jquery?

1 Answers1