[AJAX+JQUERY] Javascript in geladen pagina werkt niet

[Verwijderd]

Hoi,

Ik heb een probleem. Ik heb een index.html pagina waarop ik via jquery met load() alles binnen de <div id="content"></div> van een andere pagina laad.

Nou heb ik binnen die div ook javascript staan voor de betreffende pagina, bijvoorbeeld:

code:

<script type="text/javascript">window.alert('ahoi');</script>

Maar dit script wordt helemaal niet uitgevoerd. Hoe kan dit?

Mvg Jurgen

[_Thanatos_]

Ik gok dat de browser alleen javascript parst die initieel in de pagina staat (of waarnaar wordt verwezen natuurlijk), en script die expliciet worden geladen met in geval van jQuery de functie $.getScript()

De <script> tag wordt dus niet geparst, maar dat wil niet zeggen dat javascript in een door ajax ingeladen pagina helemaal niet wordt uitgevoerd. Het is meer dat er gewoon geen onload is. De browser heeft de DOM al doorlopen op <script> tags, en in geenzins van plan dat nog eens te gaan doen. Ook een onload zetten zal niet werken, omdat (a) de onload al is geweest en (b) het zetten van je onload niet geparst wordt.

Moeilijk dus.
Wat je kunt doen, is whatever je wilt doen in de callback van de ajax-functie zetten. Die wordt uitgevoerd als het ajax-request klaar is.

Je kunt dus nog wel degelijk events zetten in je nieuwe blok html:

JavaScript:

$.get("/blaat.html", null, function() {
  $("#blaat button").click(function() { alert("ahoi"); });
});

Ofzo. Disclaimer: niet getest

[Verwijderd]

Bedankt voor je reactie. Toch is dat het niet helemaal, want het werkt ook niet als ik een functie die eerder (in de index) gedefinieerd is aanroep. Dit kan vanuit de index wel, maar vanuit de geladen pagina niet...

[Bosmonster]

Verwijderd schreef op dinsdag 03 juni 2008 @ 22:30:
Bedankt voor je reactie. Toch is dat het niet helemaal, want het werkt ook niet als ik een functie die eerder (in de index) gedefinieerd is aanroep. Dit kan vanuit de index wel, maar vanuit de geladen pagina niet...

Maar aangezien je maar 1 pagina hebt maakt het toch niet uit als je die functie al in je originele pagina had staan en aanroept via de callback? Zoals Thanatos zegt dus.

[dB90]

eval() ?

[Verwijderd]

Bosmonster schreef op dinsdag 03 juni 2008 @ 22:35:
[...]


Maar aangezien je maar 1 pagina hebt maakt het toch niet uit als je die functie al in je originele pagina had staan en aanroept via de callback? Zoals Thanatos zegt dus.

Maar ik heb meerdere functies. De meeste worden aangeroepen door op verschillende links te klikken.

[RobIII]

hier al eens gekeken? Het is niet voor het eerst dat dit voorbij komt namelijk...
Even (op 't eerste oog) potentiële topics op een rijtje (puur op titel bekeken):

[AJAX] Het terugkrijgen van HTML met javascript
AJAX oproepen vanuit AJAX?
[js] functie gebruiken uit ajax request
[JS / AJAX] Achteraf functies toevoegen*
javascript werkt niet in een met AJAX geladen page?
etc...

[ Voor 44% gewijzigd door RobIII op 03-06-2008 23:19 ]

[_Thanatos_]

dB90 schreef op dinsdag 03 juni 2008 @ 22:57:
eval() ?

Kun je dat onderbouwen? eval (en z'n broertje setTimeout) is nml in alle gevallen op 1 na hartstikke evil, omdat het hele vervelende fouten in de hand werkt, problemen geeft met scoping, en kan leiden tot code injection. Zo ff uit m'n hoofd.

[H004]

De onderbouwing is gewoon dat javascript dat pas later toegevoegd wordt aan de DOM niet uitgevoerd wordt omdat onload etc al geweest is. Je response evallen zorgt ervoor dat nieuwe javascript opgehaald met AJAX wel uitgevoerd wordt. Eigenlijk gewoon precies zoals jij uitlegt in je eerste post in dit topic.

Javascriptlibraries noemen dit meestal "evalScripts".

Mooier is natuurlijk om met AJAX alleen nieuwe data op te halen, en geen behaviour in de vorm van Javascript. Deze zou je eigenlijk al op de pagina waarop de AJAX wordt uitgevoerd moeten worden opgenomen. Eval() is niet mooi, maar wel heel makkelijk voor dit probleem.

[ Voor 38% gewijzigd door H004 op 05-06-2008 11:52 ]

[_Thanatos_]

Javascriptlibraries noemen dit meestal "evalScripts".

Ander voorbeeld van acceptabele eval() is JSON. Maar jQuery heeft ipv "evalScript" de functie $.getScript, alhoewel dat evenmin het probleem van de TS oplost...

[ Voor 9% gewijzigd door _Thanatos_ op 05-06-2008 14:28 ]

[dB90]

Wat H004 zegt . eval is niet evil als je het op de juiste manier en op het juiste moment toepast.

[_Thanatos_]

Het is wel evil, maar misschien minder evil dan in andere situaties
Je moet gewoon alle opties uitgeput hebben voordat je naar eval grijpt. Het is geenszins een gouden hamer.

[dB90]

Er zijn inderdaad andere (betere) oplossingen denkbaar, echter probeer ik de TS een handvat te bieden zodat hij in ieder geval begrijpt dat "lazy loaded" javascript niet automatisch geevalueerd/geparst wordt.