Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS][JavaScript]Zmiany elementów wewnątrz iframe
Forum PHP.pl > Forum > Przedszkole
atom90
Witam, mam problem. Potrzebuje na zmiany wewnątrz iframe elementów, ukrycie ich usunięcie zmiany styli, lecz niestety nie jestem wstanie dotrzec do elementów z iframa.

Próbowałem tego typu zabiegów.
Kod
  $('.myIframe1 iframe html').css('color', 'red')


lub

Kod
$('iframe').load( function() {
    $('iframe').contents().find("head")
      .append($("<style type='text/css'>  .my-class{display:none;}  </style>"));
});



Nic z tego nie działa....
Comandeer
A ramka jest z tej samej domeny, co reszta?
atom90
tak
patwoj98
Skoro są w tej samej domenie to czy próbowałeś po prostu edytować w sposób nie przez jQuery, ale przez zwykły css?

Na przykład:
Kod
<iframe src="link.html" style="color: red;"></iframe>
atom90
Tak. Tylko probowałem wew elementy. Czyli tabele linki itp. Ktore nawet nie maja klas i id. Musze tam poukrywac np linki a jedynym sposobem by je dorwac to tylko href...
Comandeer
W takim razie to
Kod
$('iframe').contents()

winno działać i zwrócić Ci dokument z wnętrza ramki.
atom90
Coś robie dalej nie tak. Zrobiłem to sobie na lokalu teraz, zeby wykluczyć ze coś na serwisie koliduje.

Wyglada to tak:



no i kod:
Kod
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>contents demo</title>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
  
</head>
<body>

<iframe src="strona/1iframe.html" width="80%" height="600" id="frameDemo"></iframe>

<script>
$( "#frameDemo" ).contents().find( "a" ).css( "background-color", "#BADA55" );
</script>

</body>
</html>



wszustkie linki powinny miec tło

na wzor tego:
https://api.jquery.com/contents/
Comandeer
Hmm… A w konsoli coś jest?
atom90
Właśnie nie wiem bo błędu nie zwraca żadnego. :/ nic nie ma
trueblue
  1. $("#frameDemo").on('load',function(){
  2. $(this).contents().find("a").css("background-color","#BADA55");
  3. });
atom90
To jest to, czyli rozumiem problemem był, że nie mogłem się dostać tam bo element iframe nie wczytał jeszcze swojej zawartości? Tylko dziwi mnie, że przykład w dokumentacji pokazywał, że bez load zadziała...

BTW dzięki za pomoc
---------------------------
Po testach zauważyłem, że nie zawsze ładuje te zmiany. Raz odświeżyłem i elementy ukrywało i zmieniało style jak chciałem, a czasem nic nie robi ...
szyszakilun
Witam

Mam ten sam problem - raz działa, raz nie działa - próbowałem ponownie wykonać skrypt po 2sekundach ale omija kod z $

skrypt:
function explode2(){
$("#test").on('load',function(){
$(this).contents().find("a[href='../test.htm']").css("display","none");
$(this).contents().find("table").css("font-size","12px");
console.log("Boom2!");
});
console.log("Boom!");
}
setTimeout(explode2, 2000);

W konsoli pojawia się Boom! ale brak Boom2!....
Proszę o pomoc...

Jeszcze zauważyłem, że na mobilnych wersjach przeglądarek w ogóle nie działa sad.gif - mobilny chrome i safari (nie ma się co sugerować emulatorami mobilnych przeglądarek online bo na nich jest ok)
trueblue
Cytat(atom90 @ 15.09.2016, 09:56:13 ) *
Po testach zauważyłem, że nie zawsze ładuje te zmiany. Raz odświeżyłem i elementy ukrywało i zmieniało style jak chciałem, a czasem nic nie robi ...

W ramce nie ma elementów ładowanych dynamicznie?

Cytat(szyszakilun @ 16.09.2016, 10:17:11 ) *
Mam ten sam problem - raz działa, raz nie działa - próbowałem ponownie wykonać skrypt po 2sekundach ale omija kod z $

Co to znaczy, że omija? Jest załączone jQuery? Nie ma błędów w konsoli?
Comandeer
Tak się zastanawiam, kiedy ramka lokalna się ładuje. Czy przypadkiem czasami listener dla load się nie wykonuje, bo to zdarzenie zaszło przed jego przypięciem?
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.