jquery kullanarak iFrame üst sayfasına nasıl erişilir?

267

Bir iframe var ve üst öğeye erişmek için aşağıdaki kodu uyguladı:

window.parent.document.getElementById('parentPrice').innerHTML

Aynı sonucu jquery kullanarak nasıl elde edebilirim?
GÜNCELLEME : Veya jquery kullanarak iFrame üst sayfasına nasıl erişilir?

javascript jquery iframe

— Amr Elgarhy
kaynak

Ayrıca bkz. Stackoverflow.com/questions/12114243/…

— Alexis Wilke

489

İFrame'in üst öğesinde bulmak için:

$('#parentPrice', window.parent.document).html();

$ () Sarmalayıcısı için ikinci parametre, aranacak bağlamdır. Bu varsayılan olarak dokümandır.

— Pim Jager
kaynak

18

Harika - teşekkür etmeden önce teşekkür ettin. StackOverflow belki zaman dilimleri ile sorunlarınız mı var?

— belugabob

21

Ayrıca şunları da yapabilirsiniz: $ (window.parent.document) .find ("# parentPrice"). Html ();

— jhorback

@belugabob Bu bir sihirbazın hatası.

— Erik Escobedo

1

Window.open ile rüzgâr suyunu başlatanlar için, eski JS standart window.opener.document'i unutmayın. $ ("# someDiv", window.opener.document) çalışır.

— jjohn

2

Bu yalnızca iframe kaynağında jQuery yüklüyse çalışır. Deneyimlerime göre, iframe kaynağında jQuery olmazdı, ancak üst öğenin jQuery işlevlerinden birini çağırmak gerekir. Bunu yapmak için: window.document. $ ("# ParentPrice"). Html () Bu Álvaro G. Vicario'nun verdiği cevaptı.

— David Kinkead

39

jquery kullanarak iFrame üst sayfasına nasıl erişilir

window.parent.document.

jQuery, JavaScript'in üstündeki bir kitaplıktır, bunun yerine tam bir yedek değildir. Her son JavaScript ifadesini $ içeren bir şeyle değiştirmeniz gerekmez.

— bobince
kaynak

6

+1. jQuery harika, ama basit sorunlara birçok cevap 'jQuery kullanın' gibi görünüyor. Kitaplığı yine de yüklüyorsanız, iyi, ancak tek bir görev yüklemeyin. Ayrıca, insanlar JS perf hakkında endişeli görünüyor, daha sonra API olmadan kolayca mümkün (ve muhtemelen daha hızlı) şeyler yapmak için JS'nin üstünde bir API kullanın.

— Grant Wagner

1

@ Hibe Rağmen jQuery tarayıcılar içinde yerel kod haline hayal.

— Dan darbeler

3

@Blowski: bu benim kabusum! jQuery, resmi bir API'ye koymak için tamamen uygun olmayan çok fazla karmaşık ve kırılgan “ne demek istediğimi yap” kodu içerir.

— bobince

1

@bobince: Belli ki gerektiği zaman jQuery ile tüm Javascript değiştirin. Pastırma gibi; daha azının daha iyi olduğu bir durum yoktur. ;)

— MW.

2

OP zaten window.parent.document'e sahipti, bu yüzden bu hiçbir şeye cevap vermedi. Ve seçici mantığın bir elemanın kimliğinden çok daha karmaşık olduğunu düşünün, jQuery'nin kullanışlı olduğu bir durum. Sorunun "Fransızcada 'merhaba' nasıl diyebilirim?" ve bu cevap "Almanca konuş".

— grantwparks

13

Üst belgede jQuery örneğini bulmanız gerekiyorsa (örneğin, bir eklenti tarafından sağlanan bir yardımcı program işlevini çağırmak için) aşağıdaki sözdizimlerinden birini kullanın:

window.parent.$
window.parent.jQuery

Misal:

window.parent.$.modal.close();

jQuery windownesneye bağlanır ve olan window.parentbudur.

— Álvaro González
kaynak

İframe'imi bir kullanıcı kontrolü gibi kullanıyorum. Bu onu güzel ve temiz tutmama izin veriyor.

— Dan Randolph

11

Üst pencerenin öğelerine aşağıdaki window.parentgibi kullanarak bir iframe içinden erişebilirsiniz :

// using jquery    
window.parent.$("#element_id");

Hangisi ile aynı:

// pure javascript
window.parent.document.getElementById("element_id");

Birden fazla iç içe iframe'niz varsa ve en üstteki iframe'e erişmek istiyorsanız, şu şekilde kullanabilirsiniz window.top:

// using jquery
window.top.$("#element_id");

Hangisi ile aynı:

// pure javascript
window.top.document.getElementById("element_id");

— Amr
kaynak

7

üst pencereye koy:

<script>
function ifDoneChildFrame(val)
{
   $('#parentPrice').html(val);
}
</script>

ve iframe src dosyasında:

<script>window.parent.ifDoneChildFrame('Your value here');</script>

— stieven
kaynak

5

evet benim için de işe yarıyor.

Not: window.parent.document kullanmamız gerekir

    $("button", window.parent.document).click(function()
    {
        alert("Functionality defined by def");
    });

— Yogesh Gandhi
kaynak

5

Benim için küçük bir bükülme ile çalışıyor. Benim durumumda POPUP JS'den ANNE PENCERE formuna değer doldurmak zorundayım.

Bu yüzden kullandım $('#ee_id',window.opener.document).val(eeID);

Mükemmel!!!

— Hitesh Patel
kaynak

3

Burada oyuna biraz geç olabilir, ama bu harika jQuery eklentisini keşfettim https://github.com/mkdynamic/jquery-popupwindow . Temel olarak bir onUnload geri çağırma olayı kullanır, bu nedenle temel olarak alt pencerenin kapanmasını dinler ve bu noktada gerekli olan her şeyi gerçekleştirir. Bu nedenle, üst öğeye geri dönmek için alt pencerede herhangi bir JS yazmanıza gerek yoktur.

— cj5
kaynak

1

Bunları yapmanın birden çok yolu vardır.

I) Ana ebeveyni doğrudan alın.

Exa için. alt sayfamı iframe ile değiştirmek istiyorum

var link = '<%=Page.ResolveUrl("~/Home/SubscribeReport")%>';
top.location.replace(link);

Burada top.location doğrudan üst öğe alır.

II) ebeveyni tek tek al,

var element = $('.iframe:visible', window.parent.document);

burada birden fazla iframe'iniz varsa etkin veya görünür olanı belirtin.

daha fazla ebeveyn elde etmek için bunları da yapabilirsiniz,

var masterParent = element.parent().parent().parent()

III) Tanımlayıcı ile ebeveyn olun.

var myWindow = window.top.$("#Identifier")

— Bharat
kaynak