Muat ulang iframe dengan jQuery

Saya memiliki dua iframe pada halaman dan satu membuat perubahan ke yang lain tetapi iframe lainnya tidak menunjukkan perubahan sampai saya menyegarkan. Apakah ada cara mudah untuk menyegarkan iframe ini dengan jQuery?

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

Jika iframe tidak berada di domain yang berbeda, Anda dapat melakukan sesuatu seperti ini:

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

Tetapi karena iframe berada di domain yang berbeda, Anda akan ditolak akses ke contentDocumentproperti iframe dengan kebijakan yang sama-asal .

Tapi Anda bisa memaksa iframe lintas domain untuk memuat ulang jika kode Anda berjalan di halaman induk iframe, dengan mengatur atribut src untuk dirinya sendiri. Seperti ini:

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

Jika Anda mencoba untuk reload iframe dari iframe lain, Anda beruntung, yang adalah tidak mungkin.

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

Anda juga bisa menggunakan jquery. Ini sama dengan yang diusulkan Alex hanya menggunakan JQuery:

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

Muat ulang iframe dengan jQuery

buat tautan di dalam iframe katakanlah dengan id = "reload" lalu gunakan kode berikut

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

dan Anda baik untuk menggunakan semua browser.

Muat ulang iframe dengan HTML (tanpa Java Script req.)

Ini memiliki solusi yang lebih sederhana: yang berfungsi tanpa javaScript di (FF, Webkit)

buat saja jangkar di sisi iframe Anda

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

Ketika Anda mengklik jangkar ini, segarkan saja iframe Anda

Tetapi jika Anda memiliki parameter kirim ke iframe Anda maka lakukan sebagai berikut.

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

tidak memerlukan url halaman apa pun karena -> target = "_ SELF" lakukan untuk Anda

dengan jquery Anda dapat menggunakan ini:

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

Hanya membalas jawaban Alex tetapi dengan jQuery

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

Ini cara lain

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

Saya cukup yakin semua contoh di atas hanya memuat ulang iframe dengan src aslinya, bukan URL saat ini.

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

Itu harus dimuat ulang menggunakan url saat ini.

Jika Anda lintas domain, cukup mengatur src kembali ke url yang sama tidak akan selalu memicu memuat ulang, bahkan jika hash lokasi berubah.

Mengalami masalah ini saat membuat iframe tombol Twitter secara manual, yang tidak akan menyegarkan ketika saya memperbarui url.

Tombol suka Twitter memiliki bentuk: .../tweet_button.html#&_version=2&count=none&etc=...

Karena Twitter menggunakan fragmen dokumen untuk url, mengubah hash / fragmen tidak memuat ulang sumber, dan target tombol tidak mencerminkan konten baru saya yang dimuat ajax.

Anda dapat menambahkan parameter string kueri untuk memaksa memuat ulang (misalnya: "?_=" + Math.random() tetapi itu akan membuang-buang bandwidth, terutama dalam contoh ini di mana pendekatan Twitter secara khusus mencoba mengaktifkan caching.

Untuk memuat ulang sesuatu yang hanya berubah dengan tag hash, Anda perlu menghapus elemen, atau mengubah src, menunggu utas keluar, lalu tetapkan kembali. Jika halaman masih di-cache, ini seharusnya tidak memerlukan hit jaringan, tetapi memicu frame memuat ulang.

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

Pembaruan : Menggunakan pendekatan ini membuat item riwayat yang tidak diinginkan. Alih-alih, hapus dan buat ulang elemen iframe setiap kali, yang membuat tombol ini kembali () berfungsi seperti yang diharapkan. Senang juga tidak memiliki timer.

Hanya membalas jawaban Alex tetapi dengan jQuery:

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

Atau Anda dapat menggunakan fungsi kecil:

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

Saya harap ini membantu.

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

Ini dimungkinkan dengan JavaScript sederhana.

• Di iFrame1, buat fungsi JavaScript yang disebut di tag body onload. Saya telah memeriksa variabel sisi server yang saya atur, jadi itu tidak mencoba untuk menjalankan fungsi JavaScript di iframe2 kecuali saya telah mengambil tindakan spesifik di iframe1. Anda dapat mengatur ini sebagai fungsi yang dipicu oleh tombol tekan atau bagaimanapun Anda ingin di iframe1.
• Kemudian di iframe2, Anda memiliki fungsi kedua yang saya sebutkan di bawah ini. Fungsi di iframe1 pada dasarnya pergi ke halaman induk dan kemudian menggunakan window.framessintaks untuk memecat fungsi JavaScript di iframe2. Pastikan untuk menggunakan id/ namedari iframe2 dan bukan src.

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

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

// menyegarkan semua iframe di halaman

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'];

solusi lintas-browser adalah:

    ifrX.src = ifrX.contentWindow.location

ini berguna terutama ketika <iframe> adalah target dari suatu <form>

TERPECAHKAN! Saya mendaftar ke stockoverflow hanya untuk membagikan kepada Anda satu-satunya solusi (setidaknya di ASP.NET/IE/FF/Chrome) yang berfungsi! Idenya adalah untuk mengganti nilai innerHTML dari div dengan nilai innerHTML saat ini.

Berikut ini cuplikan 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>

Dan kode Javascript saya:

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

Semoga ini membantu.

Anda harus menggunakan

[0] .src

untuk menemukan sumber iframe dan URL-nya harus berada pada domain induk yang sama.

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

Anda bisa melakukannya seperti ini

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

Solusi di bawah ini pasti bekerja:

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