Cara mengakses Iframe induk dari JavaScript

Yah, saya punya IFrame, yang memanggil halaman domain yang sama. Masalah saya adalah saya ingin mengakses beberapa informasi dari iframe induk ini dari halaman yang disebut ini (dari JavaScript). Bagaimana saya bisa mengakses Iframe ini?

Detail: Ada beberapa Iframe seperti ini, yang dapat memuat halaman yang sama, karena saya memprogram lingkungan Windows. Saya bermaksud untuk menutup Iframe ini, itu sebabnya saya perlu tahu mana yang harus saya tutup dari dalam dirinya. Saya memiliki array yang menyimpan referensi untuk Iframe ini.

EDIT: Di sana iframe dihasilkan secara dinamis

Anda juga dapat mengatur nama dan ID ke nilai yang sama

<iframe id="frame1" name="frame1" src="any.html"></iframe>

sehingga Anda akan dapat menggunakan kode berikutnya di dalam halaman anak

parent.document.getElementById(window.name);

Cukup panggil window.frameElementdari halaman berbingkai Anda. Jika halaman tidak dalam bingkai maka frameElementakan menjadi null.

Cara lain (memasukkan elemen jendela ke dalam bingkai kurang sepele) tetapi demi kelengkapan:

/**
 * @param f, iframe or frame element
 * @return Window object inside the given frame
 * @effect will append f to document.body if f not yet part of the DOM
 * @see Window.frameElement
 * @usage myFrame.document = getFramedWindow(myFrame).document;
 */
function getFramedWindow(f)
{
    if(f.parentNode == null)
        f = document.body.appendChild(f);
    var w = (f.contentWindow || f.contentDocument);
    if(w && w.nodeType && w.nodeType==9)
        w = (w.defaultView || w.parentWindow);
    return w;
}

Saya akan merekomendasikan menggunakan API postMessage .

Di iframe Anda, hubungi:

window.parent.postMessage({message: 'Hello world'}, 'http://localhost/');

Di halaman Anda termasuk iframe Anda dapat mendengarkan acara seperti ini:

window.addEventListener('message', function(event) {
      if(event.origin === 'http://localhost/')
      {
        alert('Received message: ' + event.data.message);
      }
      else
      {
        alert('Origin not allowed!');
      }

    }, false);

By the way, juga dimungkinkan untuk melakukan panggilan ke jendela lain, dan tidak hanya iframe.

Baca lebih lanjut tentang API postMessage di blog John Resigs di sini

Pertanyaan lama, tapi saya hanya punya masalah yang sama dan menemukan cara untuk mendapatkan iframe. Ini hanyalah masalah pengulangan melalui array frame jendela [] dan menguji konten setiap frame di jendela terhadap jendela tempat kode Anda berjalan. Contoh:

var arrFrames = parent.document.getElementsByTagName("IFRAME");
for (var i = 0; i < arrFrames.length; i++) {
  if (arrFrames[i].contentWindow === window) alert("yay!");
}

Atau, menggunakan jQuery:

parent.$("iframe").each(function(iel, el) {
  if(el.contentWindow === window) alert("got it");
});

Metode ini menyimpan menugaskan ID untuk setiap iframe, yang baik dalam kasus Anda karena mereka dibuat secara dinamis. Saya tidak dapat menemukan cara yang lebih langsung, karena Anda tidak bisa mendapatkan elemen iframe menggunakan window.parent - langsung ke elemen jendela induk (melewatkan iframe). Jadi perulangan melalui mereka sepertinya satu-satunya cara, kecuali jika Anda ingin menggunakan ID.

Anda dapat menggunakan parentuntuk mengakses halaman induk. Jadi untuk mengakses suatu fungsi adalah:

var obj = parent.getElementById('foo');

Setelah id iframe diatur, Anda dapat mengakses iframe dari dokumen dalam seperti yang ditunjukkan di bawah ini.

var iframe = parent.document.getElementById(frameElement.id);

Berfungsi dengan baik di IE, Chrome dan FF.

Mungkin hanya digunakan

window.parent

ke iframe Anda untuk mendapatkan bingkai panggilan / windows. Jika Anda memiliki beberapa bingkai panggilan, Anda dapat menggunakan

window.top

Coba ini, dalam bingkai induk Anda mengatur Anda IFRAME seperti ini:

<iframe id="frame1" src="inner.html#frame1"></iframe>
<iframe id="frame2" src="inner.html#frame2"></iframe>
<iframe id="frame3" src="inner.html#frame3"></iframe>

Perhatikan bahwa id dari setiap frame dilewatkan sebagai jangkar di src.

kemudian di html batin Anda, Anda dapat mengakses id dari frame itu dimuat melalui location.hash:

<button onclick="alert('I am frame: ' + location.hash.substr(1))">Who Am I?</button>

maka Anda dapat mengakses parent.document.getElementById () untuk mengakses tag iframe dari dalam iframe

// just in case some one is searching for a solution
function get_parent_frame_dom_element(win)
{
    win = (win || window);
    var parentJQuery = window.parent.jQuery;
    var ifrms = parentJQuery("iframe.upload_iframe");
    for (var i = 0; i < ifrms.length; i++)
    {
        if (ifrms[i].contentDocument === win.document)
            return ifrms[i];
    }
    return null;
}