Перезагрузите iframe с помощью jQuery

У меня есть два iframe на странице, и один вносит изменения в другой, но другой iframe не показывает изменения, пока я не обновлю. Есть ли простой способ обновить этот iframe с помощью jQuery?

<div class="project">
  <iframe id="currentElement" class="myframe" name="myframe" src="http://somesite.com/something/new"></iframe>
</div>

Если iframe не находится в другом домене, вы можете сделать что-то вроде этого:

document.getElementById(FrameID).contentDocument.location.reload(true);

Но поскольку iframe находится в другом домене, вам будет отказано в доступе к contentDocumentсвойству iframe в соответствии с политикой того же происхождения .

Но вы можете принудительно перезагрузить междоменный iframe, если ваш код выполняется на родительской странице iframe, установив для него атрибут src. Как это:

// hackishly force iframe to reload
var iframe = document.getElementById(FrameId);
iframe.src = iframe.src;

Если вы пытаетесь перезагрузить IFRAME из другого фрейма, вы не повезло, что это не возможно.

$( '#iframe' ).attr( 'src', function ( i, val ) { return val; });

Вы также можете использовать JQuery. Это то же самое, что Алекс предложил, просто используя JQuery:

 $('#currentElement').attr("src", $('#currentElement').attr("src"));

Перезагрузите iframe с помощью jQuery

сделать ссылку внутри iframe, скажем с id = "reload", затем использовать следующий код

$('#reload').click(function() {
    document.location.reload();
});

и вам хорошо идти со всеми браузерами.

Перезагрузите iframe с помощью HTML (без требования Java Script)

У этого есть более простое решение: которое работает без javaScript в (FF, Webkit)

просто сделайте якорь внутри своей рамки

   <a href="#" target="_SELF">Refresh Comments</a>

Когда вы нажимаете этот якорь, он просто обновляет ваш фрейм

Но если у вас есть параметр send для вашего iframe, сделайте это следующим образом.

  <a id="comnt-limit" href="?id=<?= $page_id?>" target="_SELF">Refresh Comments</a>

не нужно URL страницы, потому что -> target = "_ SELF" сделает это за вас

с помощью jquery вы можете использовать это:

$('#iframeid',window.parent.document).attr('src',$('#iframeid',window.parent.document).attr('src'));

Просто отвечу взаимностью Алекса, но с помощью jQuery

var currSrc = $("#currentElement").attr("src");
$("#currentElement").attr("src", currSrc);

Вот еще один способ

$( '#iframe' ).attr( 'src', function () { return $( this )[0].src; } );

Я почти уверен, что все приведенные выше примеры только перезагружают iframe с его исходным src, а не с его текущим URL.

$('#frameId').attr('src', function () { return $(this).contents().get(0).location.href });

Это должно перезагрузить, используя текущий URL.

Если вы работаете с несколькими доменами, простая установка src на тот же URL-адрес не всегда вызывает перезагрузку, даже если хэш местоположения изменяется.

Столкнулся с этой проблемой при ручном построении фреймов кнопки Twitter, которые не обновлялись, когда я обновлял URL.

Кнопки, похожие на Twitter, имеют вид: .../tweet_button.html#&_version=2&count=none&etc=...

Так как Twitter использует фрагмент документа для URL, изменение хеша / фрагмента не перезагружало источник, и целевые кнопки не отражали мой новый загруженный ajax контент.

Вы можете добавить параметр строки запроса для принудительной перезагрузки (например, "?_=" + Math.random() но это приведет к потере пропускной способности, особенно в этом примере, где подход Twitter специально пытался включить кэширование.

Чтобы перезагрузить что-то, что изменяется только с помощью хеш-тегов, вам нужно удалить элемент или изменить src, дождаться завершения потока, а затем назначить его обратно. Если страница все еще кэшируется, это не должно требовать попадания в сеть, но вызывает перезагрузку кадра.

 var old = iframe.src;
 iframe.src = '';
 setTimeout( function () {
    iframe.src = old;
 }, 0);

Обновление : использование этого подхода создает нежелательные элементы истории. Вместо этого каждый раз удаляйте и воссоздайте элемент iframe, благодаря чему эта кнопка назад () работает должным образом. Также приятно не иметь таймера.

Просто отвечу взаимностью Алекса, но с помощью jQuery:

var e = $('#myFrame');
    e.attr("src", e.attr("src"));

Или вы можете использовать небольшую функцию:

function iframeRefresh(e) {
    var c = $(e);
        c.attr("src", c.attr("src"));
}

Я надеюсь, что это помогает.

$('IFRAME#currentElement').get(0).contentDocument.location.reload()

Это возможно с простым JavaScript.

• В iFrame1 создайте функцию JavaScript, которая вызывается в теге body onload. Я проверил установленную мной переменную на стороне сервера, поэтому он не пытается запустить функцию JavaScript в iframe2, если я не предпринял определенного действия в iframe1. Вы можете установить это как функцию, запускаемую нажатием кнопки или как хотите в iframe1.
• Затем в iframe2 у вас есть вторая функция, которую я перечислю ниже. Функция в iframe1 в основном переходит на родительскую страницу и затем использует window.framesсинтаксис для запуска функции JavaScript в iframe2. Просто убедитесь, что вы используете id/ nameиз iframe2, а не src.

//function in iframe1
function refreshIframe2()
{
    if (<cfoutput>#didValidation#</cfoutput> == 1)
    {   
         parent.window.frames.iframe2.refreshPage();
    }
}

//function in iframe2
function refreshPage()
{   
    document.location.reload();
}

// обновить все фреймы на странице

var f_list = document.getElementsByTagName('iframe');

 for (var i = 0, f; f = f_list[i]; i++) {
                            f.src = f.src;
                        }

    ifrX =document.getElementById('id') //or 
    ifrX =frames['index'];

Кросс-браузерное решение это:

    ifrX.src = ifrX.contentWindow.location

это полезно, особенно когда <iframe> является целью <form>

РЕШИТЬ! Я регистрируюсь в stockoverflow, чтобы поделиться с вами единственным решением (по крайней мере, в ASP.NET/IE/FF/Chrome), которое работает! Идея состоит в том, чтобы заменить значение innerHTML элемента div его текущим значением innerHTML.

Вот фрагмент кода HTML:

<div class="content-2" id="divGranite">
<h2>Granite Purchase</h2>
<IFRAME  runat="server" id="frameGranite" src="Jobs-granite.aspx" width="820px" height="300px" frameborder="0" seamless  ></IFRAME>
</div>

И мой код Javascript:

function refreshGranite() {           
   var iframe = document.getElementById('divGranite')
   iframe.innerHTML = iframe.innerHTML;
}

Надеюсь это поможет.

Вам нужно использовать

[0] .src

Чтобы найти источник iframe и его URL-адрес должен находиться в одном домене родительского элемента.

setInterval(refreshMe, 5000);
function refreshMe() {
    $("#currentElement")[0].src = $("#currentElement")[0].src;   
}

ты можешь сделать это так

$('.refrech-iframe').click(function(){
        $(".myiframe").attr("src", function(index, attr){ 
            return attr;
        });
    });

Ниже решение будет работать наверняка:

window.parent.location.href = window.parent.location.href;