İFrame jQuery'de bir öğe seçme

122

Uygulamamızda, bir web sayfasını ayrıştırıp bir iFrame'deki başka bir sayfaya yüklüyoruz. Yüklenen sayfadaki tüm öğelerin kendi tokenid'leri vardır. Öğeleri bu simge kimliklerine göre seçmem gerekiyor. Anlamı - Ana sayfadaki bir öğeyi tıklıyorum ve iFrame'deki sayfada ilgili öğeyi seçiyorum. JQuery'nin yardımıyla bunu şu şekilde yapıyorum:

function selectElement(token) {
     $('[tokenid=' + token + ']').addClass('border'); 
}

Ancak bu işlevle iFrame'deki değil, yalnızca geçerli sayfadaki öğeleri seçebiliyorum. Herhangi biri bana yüklü iFrame'deki öğeleri nasıl seçebileceğimi söyleyebilir mi?

Teşekkürler.

javascript iframe getelementbyid

— cycero
kaynak

157

var iframe = $('iframe'); // or some other selector to get the iframe
$('[tokenid=' + token + ']', iframe.contents()).addClass('border');

Ayrıca src, bu iframe'in güvenlik nedenleriyle farklı bir alanı işaret etmesi durumunda, javascript'te bu iframe'in içeriğine erişemeyeceğinizi unutmayın.

— Darin Dimitrov
kaynak

8

$ ['İframe'] öğesinin iframe'i doğrudan döndürmediğini unutmayın. Diziden çıkarmanız gerekiyor.

— McKayla

Yardım etme isteğiniz için teşekkürler. Ama bu işe yaramıyor gibi görünüyor.

— cycero

3

@cycero, çalışmalı. Bu iframe'i dinamik olarak mı oluşturuyorsunuz? Güvenlik nedeniyle, bu iframe'in src öğesini sizden başka bir etki alanına yönlendirirseniz, içeriğine erişemeyeceğinizi unutmayın.

— Darin Dimitrov

Farklı bir etki alanından değil aynı klasörden yüklüyorum. İFrame içerikleri dinamik olarak oluşturulur ve sunucuda bir dosya olarak saklanır. Ardından bu dosya iFrame'e yüklenir.

— cycero

@cycero, cevabımı güncelledim. iframe.contents()

— Geçmeyi

52

Bu gönderiye bir göz atın: http://praveenbattula.blogspot.com/2009/09/access-iframe-content-using-jquery.html

$("#iframeID").contents().find("[tokenid=" + token + "]").html();

Seçicinizi bulma yöntemine yerleştirin.

Ancak iframe sunucunuzdan gelmiyorsa bu mümkün olmayabilir. Diğer gönderiler, izin verilmedi hatalarından bahsediyor.

jQuery / JavaScript: bir iframe'in içeriğine erişme

— Kevin Bowersox
kaynak

Bu, öğenin HTML'sini alma açısından işe yarar, ancak bu seçilen öğeye nasıl CSS sınıfı ekleyebilirim? $ ("# iframeDiv"). içerikler (). find ("[tokenid =" + token + "]"). addClass ("border"); işe yaramıyor gibi görünüyor.

— cycero

1

İzin verilmedi hatası alıyor musunuz? Bana iframe'in html'sini verebilir misiniz?

— Kevin Bowersox

Hayır, izin verilmeyen sorunlar yok.

— cycero

20

Belgeniz hazır olduğunda bu, iframe'inizin de hazır olduğu anlamına gelmez,
bu nedenle iframe yükleme olayını dinleyip ardından içeriğinize erişmelisiniz:

$(function() {
    $("#my-iframe").bind("load",function(){
        $(this).contents().find("[tokenid=" + token + "]").html();
    });
});

— Fareed Alnamrouti
kaynak

-3

Vaka IFrame'e konsol üzerinden erişiyorsa, örneğin Chrome Dev Tools, o zaman açılır menü aracılığıyla DOM isteklerinin içeriğini seçebilirsiniz (resme bakın).

— tibersky
kaynak

-9

burada div'i yalnızca kapsayıcıda sürüklenebilir hale getirmek için bunu yapmak için basit JQuery var:

$("#containerdiv div").draggable( {containment: "#containerdiv ", scroll: false} );

— Rajasekharreddy Kadasani
kaynak