JavaScript'ten üst Iframe'e erişme

Aynı etki alanı sayfasını çağıran bir IFrame'im var. Benim sorunum, bu üst Iframe bazı bilgilere bu çağrılan sayfadan (JavaScript) erişmek istiyorum. Bu Iframe'e nasıl erişebilirim?

Ayrıntılar: Bir Windows ortamını programladığım için, bunun gibi aynı sayfanın yüklü olabileceği birkaç Iframe vardır. Bu Iframe'i kapatmayı planlıyorum, bu yüzden onun içinden hangisini kapatmam gerektiğini bilmem gerekiyor. Bu iframe'ler referansları tutan bir dizi var.

EDIT: Dinamik olarak üretilen iframe'ler var

Ayrıca adı ve kimliği eşit değerlere ayarlayabilirsiniz

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

böylece alt sayfada bir sonraki kodu kullanabileceksiniz

parent.document.getElementById(window.name);

Sadece window.frameElementçerçeveli sayfanızdan arayın . Sayfa bir çerçeve içinde değilse o frameElementzaman olacaktır null.

Diğer yol (pencere elemanını bir çerçevenin içine almak daha az önemsizdir) ancak tamlık uğruna:

/**
 * @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;
}

PostMessage API'sini kullanmanızı tavsiye ederim .

İframe'inizde arayın:

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

İframe'i eklediğiniz sayfada aşağıdaki gibi etkinlikleri dinleyebilirsiniz:

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

    }, false);

Bu arada, sadece iframe'leri değil, diğer pencerelere çağrı yapmak da mümkündür.

John Resigs blogunda postMessage API'sı hakkında daha fazla bilgiyi buradan edinebilirsiniz

Eski soru, ama ben sadece aynı sorunu vardı ve iframe almak için bir yol buldum. Bu sadece üst pencerenin frames [] dizisi üzerinden yineleme ve her karenin contentWindow'unu kodunuzun çalıştığı pencereye karşı test etme meselesidir. Misal:

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

Veya jQuery kullanarak:

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

Bu yöntem, her iframe'e bir kimlik atamayı kaydeder; bu, dinamik olarak oluşturuldukları için sizin durumunuzda iyidir. Daha doğrudan bir yol bulamadım, çünkü window.parent kullanarak iframe öğesini alamazsınız - doğrudan üst pencere öğesine (iframe'i atlayarak) gider. Bu nedenle, kimlik kullanmak istemediğiniz sürece, bunların içinden geçmek tek yol gibi görünüyor.

parentüst sayfaya erişmek için kullanabilirsiniz . Yani bir fonksiyona erişmek için:

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

İframe kimliği ayarlandıktan sonra, iç çerçeveden iframe'e aşağıda gösterildiği gibi erişebilirsiniz.

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

IE, Chrome ve FF'de iyi çalışır.

Belki sadece kullanın

window.parent

çağıran çerçeveyi / pencereleri almak için iframe'inize ekleyin. Birden fazla arama çerçeveniz varsa,

window.top

Bunu deneyin, ana çerçevenizde IFRAME'leri şöyle ayarlayın:

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

Her karenin kimliğinin src'de bir çapa olarak iletildiğini unutmayın.

iç html'nizde yüklendiği çerçevenin kimliğine location.hash üzerinden erişebilirsiniz:

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

iframe etiketine iframe içinden erişmek için parent.document.getElementById () öğesine erişebilirsiniz.

// 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;
}