• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Zasięg funkcji w podstronach (Iframe) [JQUERY]

0 głosów
61 wizyt
pytanie zadane 24 września 2018 w JavaScript, jQuery, AJAX przez Oskar Szkurłat Obywatel (1,170 p.)
edycja 25 września 2018 przez Oskar Szkurłat

Witam napisałem sobie krótką funkcję:

$('img').click(function() {
    var CLASS = this.className;
	if (CLASS == "Obrazek")
	{
		var SRC = this.src;
		$("#TransparentBackgroundGalleryID").prop('disabled',true);
		$("#GalleryZoomedImageID").attr("src",SRC);
		
		
		$('#EscapeZoomImageButton').click(function() {
			$("#TransparentBackgroundGalleryID").prop('disabled',false);
			$("#GalleryZoomedImageID").attr("src","");
		});
		
		$(document).keyup(function(e) {
			if (e.keyCode === 27) $('#EscapeZoomImageButton').click();
		});
	
	} else 
	{
		alert ( CLASS + " cos nie dziala" );
	}
	
});

<!DOCTYPE html>
<html>
<head>
</head>

<body>
<div class="BodyDiv" id="BodyDivID"> 

	<div class="GalleryZoomedImage" id="TransparentBackgroundGalleryID">
		<img id="GalleryZoomedImageID" width="90%" height="auto" src="">
		<a id="EscapeZoomImageButton">Zamknij podgląd</a>
	</div>

<iframe allowTransparency="true" src="Home_1.php" id="IframeBodyDiv_2" class="iframe" onload="SetSize('MyIframe')"></iframe>
	
	
	<!-- Dodawanie "biblioteki" -->
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
	
	<script type="text/javascript" src="ownGalleryZoomImage.js">
		//Galeria: powiekszanie zdjecia
	</script>

</body>
</html>
<img alt="Budowa" class="Obrazek" src="Home_1_25_926454212.JPG" style="width: 50%;" /><br />
<br />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript" src="ownGalleryZoomImage.js">
        //Galeria: powiekszanie zdjecia
</script>

 

 

W skrócie co powinna robić:
Po wciśnięciu na element rodzaju img zapisuje klasę w zmiennej CLASS. Następnie jeżeli jest to klasa "Obrazek" to: zapisuje wartość ów obrazka w SRC, ujawnia obiekt o ID TransparentBackgroundGalleryID oraz podmienia źródło elementu o ID GalleryZoomedImageID. Ponadto po wciśnięciu elementu o ID EscapeZoomImageButton ukrywa wyżej przedstawiony element oraz czyści źródło obrazka (identycznie zachowuje się poprzez wciśnięcie przycisku escape na klawiaturze).
Wnioski i problem:
Testowałem, że działa odczyt SRC i CLASS, natomiast w moim przypadku chciałbym, aby dokonywało to bezpośrednio na obrazkach zawartych w IFrame. Niestety w okienku Iframe nie reaguje funkcja. Co mógłbym zrobić, aby po wciśnięciu na obrazek zawarty w iframe funkcja reagowała wywołując elementy z "głównej strony"? Próbowałem podpiąć tą samą funkcję do podstrony wywołanej na Iframe, natomiast bezskutecznie.

1
komentarz 25 września 2018 przez JSHolic Szeryf (78,320 p.)

Czy ten iframe znajduje się w tej samej domenie, co strona? Gdzie jest kod, którym próbujesz coś robić z iframe?

1
komentarz 25 września 2018 przez ShiroUmizake Nałogowiec (44,700 p.)
Jeżeli nie, czy jest zgoda na cross-domain.
komentarz 25 września 2018 przez Oskar Szkurłat Obywatel (1,170 p.)

@JSHolic, tak, ta sama domena. Obie strony hostuję w jednym public.html.
Nie rozumiem drugiego pytania. Skrypt JQuery jest pierwszym dodanym kodem w poście, to on reaguje ma reagować na img w podstronach pokazanych na iframe.
Drugi kod to fragment strony Parent.
Trzeci to podstrona wyświetlana w IFrame.

1
komentarz 25 września 2018 przez JSHolic Szeryf (78,320 p.)

Żeby dostać do DOMu wewnątrz iframe odnieś się do jego własności contentDocument i dopiero stamtąd możesz sobie szukać obrazka. Czyli na przykład:

var imgFromIframe = document.querySelector('iframe').contentDocument.querySelector('img');

 

Zaloguj lub zarejestruj się, aby odpowiedzieć na to pytanie.

Podobne pytania

0 głosów
1 odpowiedź 85 wizyt
0 głosów
1 odpowiedź 107 wizyt
0 głosów
1 odpowiedź 232 wizyt
Porady nie od parady
Pytania na temat serwisu SPOJ należy zadawać z odpowiednią kategorią dotyczącą tej strony.SPOJ

64,016 zapytań

110,391 odpowiedzi

231,155 komentarzy

47,799 pasjonatów

Przeglądających: 307
Pasjonatów: 15 Gości: 292

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...