javascript - change src of iframe and then reload the iframe - Stack Overflow

admin管理员组

文章数量:1186688

I managed to change an iframe's src with javascript

var path='images/tattoo/fullsize/';
var h=$('#borderlessFrame').height();
var bigFrame=$('#borderlessFrame');
function loadGallery(num)
{
    bigFrame=$('#borderlessFrame');
    var galPath=path + num;             // path to the image
    h=$('#borderlessFrame').height();
    var source=bigFrame.attr('src');
    source='i load some address here';
}

But for now i see the old content of the iframe , is there a way to reload the iframe ( only iframe not the whole page) The thing i am trying to achieve is a simple gallery , thumb pictures on the bottom and a large picture on the top ( iframe ). On click on any of the thumbs , i change the content of the iframe without reloading the actual page.

Keep in mind that i am new to html/javascript/jquery. So basically i need a way(function?) to reload the iframe.

I managed to change an iframe's src with javascript

var path='images/tattoo/fullsize/';
var h=$('#borderlessFrame').height();
var bigFrame=$('#borderlessFrame');
function loadGallery(num)
{
    bigFrame=$('#borderlessFrame');
    var galPath=path + num;             // path to the image
    h=$('#borderlessFrame').height();
    var source=bigFrame.attr('src');
    source='i load some address here';
}

But for now i see the old content of the iframe , is there a way to reload the iframe ( only iframe not the whole page) The thing i am trying to achieve is a simple gallery , thumb pictures on the bottom and a large picture on the top ( iframe ). On click on any of the thumbs , i change the content of the iframe without reloading the actual page.

Keep in mind that i am new to html/javascript/jquery. So basically i need a way(function?) to reload the iframe.

• javascript
• jquery

Share Improve this question Follow asked Jan 24, 2012 at 15:17 JordashiroJordashiro 80544 gold badges1616 silver badges2727 bronze badges 4

• In 11 lines of code you managed to query for '#borderlessFrame' 4 times... Cache the reference please! – Šime Vidas Commented Jan 24, 2012 at 15:19
• document.getElementById('calendar').src = loc; – stian.net Commented Jan 24, 2012 at 15:20
• I always thought if you changed the src it would reload the frame automatically? – 472084 Commented Jan 24, 2012 at 15:22
• 1 @Jleagle it does, but he never actually changed the iframe's src. – Kevin B Commented Jan 24, 2012 at 15:23

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 14

To set attribute, you need to call .attr( attributeName, value )

Try this:

var source='i load some address here';
bigFrame.attr('src', source);

Reference:

jQuery .attr()

jQuery has the load method, which is useable like so (assuming borderlessFrame is the id of the <iframe>):

var iFrame = $('#borderlessFrame');
iFrame.load('http://theurltoload.com')

However, iframes seem like an unnecessary approach for your requirements, consider looking into CSS and the jQuery DOM manipulation methods a little more.

本文标签： javascriptchange src of iframe and then reload the iframeStack Overflow