Basic jQuery question: How to change iframe src by clicking a link?

Question

I have an iframe that looks like this:

<iframe src="http://www.google.com" height=1000 width="500" id="myiframe"></iframe>

I want to create a link so that when I click on it, the iframe on the page changes. How can I do that using jquery?

Is it related to jquery attr?

Thanks!

Answer 1

.attr('src', 'newSource.html')

Answer 2

You don't need jQuery for that. You don't even need JavaScript for that.

Give your iframe a name, and target your anchors to point to it:

<a href="foo.html" target="myiframe">Foo</a>
<a href="bar.html" target="myiframe">Bar</a>
<a href="baz.html" target="myiframe">Baz</a>

<iframe name="myiframe"></iframe>

This degrades nicely for people who have JavaScript turned off.