Forum PHP.pl > Skrypty JS w divie

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki

michalcpp

7.07.2015, 09:36:27

Mam na mojej stronie dwa pliki: index.php i settings.php;
Na stronie index.php znajduje sie div do ktorego laduję zawartość strony settings.php za pomocą ajax'a. Strona sie dobrze laduje do diva, lecz wszystkie skrypty JS na tej stronie nie dzialaja poprawnie. Gdy wchodze normalnie do pliku settings.php wszystkie skrypty dzialają, lecz gdy laduję ją do diva, zaden skrypt JS nie dziala.

Comandeer

7.07.2015, 10:54:32

jQuery radzi sobie z tym tak, że skrypty przepuszcza przez eval (czyli marnie sobie radzi

).

Co to są za skrypty? Nie da się ich po prostu przerzucić do callbacku żądania ajaksowego?

michalcpp

7.07.2015, 11:17:36

Są to skrypty JQuery UI, na przyklad takie:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function() {
	$("#potwierdz")
	.mouseover(function() {
		$("#potwierdz").stop().animate({left: 300, height: 50, width: 50}, {duration: 300, easing: 'easeOutBack'});
	})
	.mouseout(function() {
		$("#potwierdz").stop().animate({left: 305, height: 40, width: 40}, {duration: 300, easing: 'easeOutBack'});
	});
 
});
[JAVASCRIPT] pobierz, plaintext

jak wejde na strone settings.php (na ktorej wlasnie sa te skrypty) to wszystko dziala poprawnie, lecz skrypty nie dzialaja gdy laduję ja do diva za pomoca ajax'a w taki sposob:

[JAVASCRIPT] pobierz, plaintext 
var object = false;
 
if (window.XMLHttpRequest) object = new XMLHttpRequest();
else if (window.ActiveXObject) object = new ActiveXObject("Microsoft.XMLHTTP");
 
 if (object.readyState==4 || object.readyState==0) 
 {
    var obj = document.getElementById('DivUstawienia');
    object.open("GET", 'settings.php');
    object.onreadystatechange = function()
    {
        if (object.readyState == 4 && object.status == 200) 
        obj.innerHTML= object.responseText;
     }
       object.send(null);
 }
[JAVASCRIPT] pobierz, plaintext

nospor

7.07.2015, 11:21:36

Skoro uzywasz jQuery to i do ajaxa i innych przypisan uzywaj jQuery a wszystko bedzie dzialac.
.innerHTML nie interpretuje kodu js - zagadka rozwiązana

zamiast:
obj.innerHTML= object.responseText;

daj:
jQuery(obj).html(object.responseText);

michalcpp

7.07.2015, 11:48:34

Uzylem tego
jQuery(obj).html(object.responseText);
zamiast
obj.innerHTML= object.responseText;
i strona przestala dzialac...

Gdy probuje wejsc na strone login.php(na niej znajduje sie ten skrypt ladujacy strone settings.php do diva) przez sekunde cala zawartosc ztrony jest wyswietlana, lecz pozniej wszystko znika,a w konsoli chrom'a wyswietla sie tylko takie cos:

[HTML] pobierz, plaintext 
<html>
   <head>
      <script type="text/javascript" charset="iso-8859-2" src="http://go.idmnet.bbelements.com/please/showit/0/0/0/1/?    typkodu=js&one2n1=/1276/1/1/1/;1276.1.1.1;&one2n=1&ubl=pl&ucd=24&uce=1&uje=1&uah=1040&uaw=1920&uhe=1080&uwi=1920&uto=-120&uti=1436265954249&ibbid=BBID-01-01109791535818535&alttext=0&border=0&bust=0.30917197722010314&target=_top"></script>
   </head>
</html>
[HTML] pobierz, plaintext

a strona sie ciagle laduje i nic to nie daje

A gdy wejde na strone settings.php wszystko dziala poprawnie.

nospor

7.07.2015, 11:50:47

POkaz jak DOKLADNIE wyglada plik settings.php oraz login.php

Comandeer

7.07.2015, 11:51:23

Masz użyć zamiast całego tego ajaksa jego odpowiednika w jQuery ALBO przerzucić wywołania tych funkcji do object.onreadystatechange (proponuję rozwiązanie #1)

Co do problemu z login.php - wygląda jak jakiś skrzaczony skrypt reklam…

tzm

7.07.2015, 12:56:51

Delegacje w jQuery ?

[HTML] pobierz, plaintext 
$(document).on('event', 'selektor', function(){});
[HTML] pobierz, plaintext

Comandeer

7.07.2015, 13:23:44

@tzm tak byłoby prosto, gdyby nie to, że jQuery UI nie bardzo z tym działa

Ono musi operować na konkretnym elemencie. Dlatego najlepiej jest wywoływanie jego metod przerzucić jako callback dla Ajaksa. Inny sposób to podpięcie się przez MutationObserver i badanie czy nowy element tego typu nie jest wstawiany do dokumentu. Odmianą tego sposobu jest podpięcie w CSS animacji/przejścia do tego elementu i wykrywanie wstawienia go przez animationstart/transitionstart.

Inna rzecz, że pokazany tutaj skrypt z $.fn.mouseover faktycznie bez problemu zadziała z event delegation (bo nie jest to jQuery UI, jak głosi reszta postu).

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.