Перезавантажте 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 req.)

У ньому є більш просте рішення: яке працює без javaScript в (FF, Webkit)

просто зробіть якір усередині вашого рамки

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

Коли ви натискаєте на цей якір, він просто оновить ваш кадр

Але якщо у вас є параметр, надішліть свій 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. У мене він перевірить встановлену я бічну сторону сервера, тому він не намагається запустити функцію JavaScript у iframe2, якщо я не вжив конкретних дій у iframe1. Ви можете налаштувати це як функцію, запущену натисканням кнопки, або якби ви хочете це в iframe1.
• Потім у iframe2 ви маєте другу функцію, яку я перелічу нижче. Функція iframe1 в основному переходить на батьківську сторінку, а потім використовує window.framesсинтаксис для запуску функції JavaScript у iframe2. Просто переконайтеся, що використовуєте id/ nameof iframe2, а не the 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), яке працює! Ідея полягає в тому, щоб замінити внутрішнє значення HTML на 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;