69 votes

Appeler une fonction JavaScript renvoyée par une réponse Ajax

J'ai un système où j'envoie une commande Ajax, qui renvoie un bloc de script avec une fonction. Une fois que ces données sont correctement insérées dans la DIV, je souhaite pouvoir appeler cette fonction pour effectuer les actions requises.

Est-ce possible?

75voto

Federico Zancan Points 2480

Je pense que pour interpréter correctement à votre question sous cette forme: "OK, j'ai déjà fait avec de l'Ajax choses; je souhaite juste savoir si la fonction JavaScript de mon Ajax rappel inséré dans le DIV est dénonçable à tout moment à partir de ce moment, qui est, je ne veux pas l'appeler contextuellement à la fonction de rappel de retour".

OK, si tu veux dire quelque chose comme cela, la réponse est oui, vous pouvez appeler votre nouveau code en ce moment, à n'importe quel moment pendant la page de la persistance dans le navigateur, dans les conditions suivantes:

1) Votre code JavaScript retourné par Ajax fonction de rappel doit être syntaxiquement CORRECTE;
2) Même si votre déclaration de fonction est insérée dans un <script> bloc à l'intérieur d'un <div> élément, le navigateur ne sais pas la nouvelle fonction existe, comme le code de déclaration n'a jamais été exécuté. Donc, vous devez d' eval() votre déclaration code renvoyé par l'Ajax de rappel, afin de bien déclarer votre nouvelle fonction et qu'il soit disponible pendant toute la page, de la durée de vie.

Même si tout à fait factice, ce code explique l'idée:

<html>
    <body>
        <div id="div1">
        </div>
        <div id="div2">
            <input type="button" value="Go!" onclick="go()" />
        </div>
        <script type="text/javascript">
            var newsc = '<script id="sc1" type="text/javascript">function go() { alert("GO!") }<\/script>';
            var e = document.getElementById('div1');
            e.innerHTML = newsc;
            eval(document.getElementById('sc1').innerHTML);
        </script>
    </body>
</html>

Je n'ai pas utiliser Ajax, mais le concept est le même (même si l'exemple que j'ai choisi n'est pas très intelligent :-)

En règle générale, je ne remets pas en cause votre conception de la solution, c'est à dire s'il est plus ou moins approprié à extérioriser + généraliser la fonction dans un autre .fichier js et autres, mais veuillez prendre note qu'une telle solution pourrait soulever plus de problèmes, surtout si votre Ajax invocations de répétition, c'est à dire si le cadre de la même fonction, doit changer ou, dans le cas de la fonction déclarée persistance doit être concerné, donc peut-être que vous devriez sérieusement envisager de changer votre conception de l'un de ces exemples dans ce fil.

Enfin, si j'ai mal compris votre question, et vous parlez contextuelle invocation de la fonction lors de votre Ajax callback retourne, puis mon sentiment est de proposer le Prototype de l'approche décrite par krosenvold, comme il est cross-browser, testé et entièrement fonctionnel, et cela peut vous donner une meilleure feuille de route pour les futures implémentations.

42voto

Dandymon Points 131

Aucun de ces fonctionné pour moi

Ce qui suit ne!

Il m'a fallu quelques heures pour trouver une solution de contournement.

À l'intérieur de l'retourné HTML/Ajax/JavaScript fichier, vous aurez une balise JavaScript. Donner un ID, comme runscript. Il est rare d'ajouter un id à ces balises, mais il est nécessaire de faire référence en particulier.

<script type="text/javascript" id="runscript">
    alert("running from main");
</script>

Dans la fenêtre principale, puis d'appeler la fonction eval en évaluant seulement que le NOUVEAU bloc de code JavaScript (dans ce cas, il est appelé runscript):

eval(document.getElementById("runscript").innerHTML);

Et ça marche, au moins dans Internet Explorer 9 et Google Chrome.

9voto

krosenvold Points 35979

Il est tout à fait possible, et il y en a même assez légitime en cas d'utilisation de ce. En utilisant le Prototype de cadre, il est fait comme suit.

new Ajax.Updater('items', '/items.url', {
    parameters: { evalJS: true}
});

Voir la documentation de l'Ajax programme de mise à jour. Les options sont dans la commune de réglage des options. Comme d'habitude, il y a quelques mises en garde à propos de lorsque "cela" points de, afin de lire les petits caractères.

Le code JavaScript sera évalué lors du chargement. Si le contenu contient la fonction myFunc(), on pourrait juste dire myFunc() par la suite. Peut-être comme suit.

if (window["myFunc"])
   myFunc()

Celui-ci vérifie si la fonction existe. Peut-être que quelqu'un a une meilleure manière de croix-navigateur de faire ce qui fonctionne dans Internet Explorer 6.

6voto

DanSingerman Points 17301

Cela semble une conception assez étrange pour votre code - il est généralement plus logique d’appeler vos fonctions directement à partir d’un fichier .js, puis de ne récupérer que les données avec l’appel Ajax.

Cependant, je pense que cela devrait fonctionner en appelant eval () sur la réponse - à condition que le code JavaScript soit syntaxiquement correct.

5voto

kgiannakakis Points 62727

Avec jQuery, je le ferais avec getScript

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X