Foros del Web

Foros del Web (http://www.forosdelweb.com/)
-   Frameworks JS (http://www.forosdelweb.com/f127/)
-   -   HOWTO: Ejecutar javascript que viene de ajax (http://www.forosdelweb.com/f127/howto-ejecutar-javascript-que-viene-ajax-510438/)

MaBoRaK 06/08/2007 14:23
HOWTO: Ejecutar javascript que viene de ajax
 
loading.....................

En vista de que muchos aun se preguntan como interpretar javascript que viene con ajax

Cita:
Texto que tiene javascript
<script>
alert("aqui mismo");
</script>
y mas
Si reciben eso y lo pegan en un Div o cualquier otro elemento, el javascript que tiene dentro no se ejecutará

Código PHP:
        myDiv.innerHTML=ajax.responseText; 
Bueno..... todo eso ya es conocido.

Manos a la obra
interpretadorAjax.js
Código PHP:
        var tagScript = '(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)';
        /**
        * Eval script fragment
        * @return String
        */
        String.prototype.evalScript = function()
        {
                return (this.match(new RegExp(tagScript, 'img')) || []).evalScript();
        };
        /**
        * strip script fragment
        * @return String
        */
        String.prototype.stripScript = function()
        {
                return this.replace(new RegExp(tagScript, 'img'), '');
        };
        /**
        * extract script fragment
        * @return String
        */
        String.prototype.extractScript = function()
        {
                var matchAll = new RegExp(tagScript, 'img');
                return (this.match(matchAll) || []);
        };
        /**
        * Eval scripts
        * @return String
        */
        Array.prototype.evalScript = function(extracted)
        {
                var s=this.map(function(sr){
                         var sc=(sr.match(new RegExp(tagScript, 'im')) || ['', ''])[1];
                         if(window.execScript){
                              window.execScript(sc);
                         }
                        else
                       {
                           window.setTimeout(sc,0);
                        }
                });
                return true;
        };
        /**
        * Map array elements
        * @param {Function} fun
        * @return Function
        */
        Array.prototype.map = function(fun)
        {
                if(typeof fun!=="function"){return false;}
                var i = 0, l = this.length;
                for(i=0;i<l;i++)
                {
                        fun(this[i]);
                }
                return true;
        }; 
Forma de uso:
  1. Incluir el archivo interpretadorAjax.js en su Header.
  2. Interpretando.
    1. Interprete normal
      Código:
      Texto blabla
      <script type='text/javscript'>alert('algo');</script>
      Otro texto blabla
      Código PHP:
              var scs=myAjax.responseText.extractScript();    //capturamos los scripts
                    myDivUoTroLugar.innerHTML=myAjax.responseText.stripScript();    //eliminamos los scripts... ya son innecesarios
                    scs.evalScript();       //ahora si, comenzamos a interpretar todo 
    2. Ahora bien, para interpretar archivos javascript
      Código:
      <script type='text/javascript'>alert('algo');</script>
      Texto blabla
      <script type='text/javascript' src="algo.js"></script>
      Otro texto blabla
      Se debe hacer.

      Código PHP:
              var scs=myAjax.responseText.extractScript();    //capturamos los scripts
                    myDivUoTroLugar.innerHTML=myAjax.responseText
              scs      .evalScript();       //ahora si, comenzamos a interpretar todo 
En teoría es mejor usar la opción b.

Espero les sirva y es similar al eval de prototype pero yo lo pensé antes... :patada: :serio:

http://maborak.com/logo/logo.gif

connection closed.

calvin_naranjo 07/08/2007 16:50
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola, interesante solución con prototype, pero leí como en tres sitios que no era recomendable usar eval para este tipo de procesos... que te dice tu experiencia al respecto....??
Gracias por la solución..

MaBoRaK 07/08/2007 17:48
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading.............

Es la forma mas sencilla que le veo a interpretar texto plano como javascript... e igual no le veo el peligro.... que de malo tendria hacer un eval? si con un par de extensiones igual puedo inyectar codigo javascript en cualquier página :S

connection closed.

MaBoRaK 07/08/2007 17:50
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading...........

Otra forma mas tediosa sería crear tags script por cada script encontrado en extracScript. con algun identificador para evitar doble parseo.

connection closed.

vb2005 07/08/2007 18:37
Re: HOWTO: Ejecutar javascript que viene de ajax
 
gracias, una pregunta porque siempre pones loading...........?

MaBoRaK 07/08/2007 23:44
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading.....................

Bueno 7 años atras andaba tras el hacking... y de ahí que siempre firmaba de esa forma porque mis exploits las iniciaba así... para conectar a un target y tambien para finalizarlo..........y se me quedó jeje 8)

connection closed.

Panino5001 08/08/2007 07:17
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola MaBoRak, me gusta más esta manera:
Código PHP:
<script>
function SetContainerHTML(id_contenedor,responseText)
{
mydiv = document.getElementById(id_contenedor);
mydiv.innerHTML = responseText;
var elementos = mydiv.getElementsByTagName('script');
for(i=0;i<elementos.length;i++) {
var elemento = elementos[i];
nuevoScript = document.createElement('script');
nuevoScript.text = elemento.innerHTML;
nuevoScript.type = 'text/javascript';
if(elemento.src!=null && elemento.src.length>0)
{nuevoScript.src = elemento.src;}
elemento.parentNode.replaceChild(nuevoScript,elemento);
}
}

</script> 

MaBoRaK 08/08/2007 07:36
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading...........


Sip, muy buena, pero hay algo ahi.... si haces la misma peticion como 10 veces, crearas 10 veces los mismos elementos SCRIPT.

Mientras que con este eval, simplemente INTERPRETAS y no se queda en memoria el elemento SCRIPT


connection closed.

Panino5001 08/08/2007 07:42
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Si, es cierto, pero es fácilmente solucionable agregándole a cada script generado un id del tipo 'prefix'+i, y agregando un condicional como este: if(document.getElementById('prefix'+i)), y un removeChild si se cumple el if, no?

Panino5001 08/08/2007 07:47
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Entonces quedaría así:
Código PHP:
<script>
function SetContainerHTML(id_contenedor,responseText)
{
mydiv = document.getElementById(id_contenedor);
mydiv.innerHTML = responseText;
var elementos = mydiv.getElementsByTagName('script');
for(i=0;i<elementos.length;i++) {
old=document.getElementById('prefix'+i);
if(old)mydiv.removeChild(old)
var elemento = elementos[i];
nuevoScript = document.createElement('script');
nuevoScript.text = elemento.innerHTML;
nuevoScript.type = 'text/javascript';
nuevoScript.id = 'prefix'+i;
if(elemento.src!=null && elemento.src.length>0)
{nuevoScript.src = elemento.src;}
elemento.parentNode.replaceChild(nuevoScript,elemento);
}
}

</script> 

Panino5001 08/08/2007 08:21
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Bueno, esta sería la prueba:
Código PHP:
<script>
function SetContainerHTML(id_contenedor,responseText)
{
mydiv = document.getElementById(id_contenedor);
mydiv.innerHTML = responseText;
var elementos = mydiv.getElementsByTagName('script');
for(i=0;i<elementos.length;i++) {
old=document.getElementById('prefix'+i);
if(old)mydiv.removeChild(old)
var elemento = elementos[i];
nuevoScript = document.createElement('script');
nuevoScript.text = elemento.innerHTML;
nuevoScript.type = 'text/javascript';
nuevoScript.id = 'prefix'+i;
if(elemento.src!=null && elemento.src.length>0)
{nuevoScript.src = elemento.src;}
elemento.parentNode.replaceChild(nuevoScript,elemento);
}
}
txt='hola<scr'+'ipt>alert("hola");alert(document.getElementsByTagName("script").length);</sc'+'ript>';
</script>  
<div id="pepe" onclick="SetContainerHTML('pepe',txt)">bla</div> 

Panino5001 08/08/2007 08:31
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Aunque lo curioso es que compruebo también que no es necesario el if. En cada llamada a la función se elimina el elemento script anterior, ya que sige apareciendo 2 como resultado:
Código PHP:
<html>
<head>
<script>
function SetContainerHTML(id_contenedor,responseText)
{
mydiv = document.getElementById(id_contenedor);
mydiv.innerHTML = responseText;
var elementos = mydiv.getElementsByTagName('script');
for(i=0;i<elementos.length;i++) {
old=document.getElementById('prefix'+i);
//if(old)mydiv.removeChild(old)
var elemento = elementos[i];
nuevoScript = document.createElement('script');
nuevoScript.text = elemento.innerHTML;
nuevoScript.type = 'text/javascript';
//nuevoScript.id = 'prefix'+i;
if(elemento.src!=null && elemento.src.length>0)
{nuevoScript.src = elemento.src;}
elemento.parentNode.replaceChild(nuevoScript,elemento);
}
}
txt='hola<scr'+'ipt>alert("hola");alert(document.getElementsByTagName("script").length);</sc'+'ript>';
</script>
</head> 
<body>
<div id="pepe" onClick="SetContainerHTML('pepe',txt)">bla</div>
</body>
</html> 
Siempre devuelve 2

MaBoRaK 08/08/2007 10:32
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading.............

Ok te lo complico mas :p
Tienes 3 procesos AJAX.
  • Cargas 2 scripts
  • cargas 7 scripts
  • cargas nada

como es ajax... se dará el caso de que en la opcion 2 ahora ya no se cargan 7 scripts, sinó 3 y son DISTINTOS a los que registraste con prefix.

Otro ejemplo: Tienes un proceso ajax que en su primera ejecucion te crea 3 scripts... en el segundo llamado ejecuta 2 scripts que dependen de los 3 primeros creados..... es como decir, yo dejó aca sctos scripts por si alguien o YO MISMO las vaya a usar adelante.


connection closed.

Panino5001 08/08/2007 11:08
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Sí, pero la cosa es que no se multilplican en cada consulta, probá el ejemplo que puse, donde comenté el condicional agregado, y vas a ver que en cada consulta el número de tags script no se incrementa sino que permanece constante.
Lo que sucede, es que usamos replaceChild sobre el mismo contenedor, luego de modificar su contenido con innerHTML, entonces desaparecen en cada llamada los tags script anteriores.

MaBoRaK 08/08/2007 13:26
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading............

Ahora el problema no son la cantidad de scripts... sinó el reemplazo que haces de ellas... no tienes control de QUE SCRIPTS REEMPLAZA y cuales no.

connection closed.

MaBoRaK 09/08/2007 20:57
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading.............

No se si sea bug pero... he visto que si haces eval() dentro de una funcion, las variables no son globales... sino locales GRR!!!!!!!!!!!!! ya lo solucionaré

connection closed.

MaBoRaK 09/08/2007 21:25
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading..........


SOLUCIONADO:
simplemente hay que cambiar
eval()
por
setTimeout(cadenaAevaluar,0);

connection closed.

drada 11/08/2007 01:55
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Llevo unas horas sin parar intentando borrar unas funciones cargadas por ajax y no se porque removeChild y replaceChild no me funcionan :S.

Buscando por internet me he topado con vuestro post y dado que parece que hay conocimientos :) me gustaría saber si sabéis como solucionarlo:

Quiero hacer una web en ajax y cada página que pasó a través de ajax carga una serie de funciones y elementos nuevos en javascript y css... pero el problema es que he visto que al menos en Internet Explorer 6, 7 y Firefox las funciones se van acumulando y no borra las anteriores (de otras páginas)...

He hecho muchas pruebas y muchos ejemplos, os puedo dejar este que se ve a simple vista:

Código PHP:
<html> 
<head> 
<script> 
java1="var segundos=1000;function Vamos() {var prueba=document.getElementById(\"prueba\");prueba.innerHTML = \"ok\";}timer = setTimeout(\"cuentaAtras()\", 1000);function cuentaAtras(){    var cuenta=document.getElementById(\"cuenta\");    cuenta.innerHTML=segundos;    segundos--;    timer = setTimeout(\"cuentaAtras()\", 1000);}";
java2="function Vamos() {var prueba=document.getElementById(\"prueba\");prueba.innerHTML = \"no\";}timer = setTimeout(\"cuentaAtras()\", 1000);";

var viejoscript;

function CargarJava() {
    var prueba=document.getElementById("prueba");
    viejoscript = document.createElement('script'); 
    viejoscript.text = java1; 
    viejoscript.type = 'text/javascript'; 
    prueba.appendChild(viejoscript);
}
function CargarJava2() {
    var prueba=document.getElementById("prueba");
    var elemento = prueba.getElementsByTagName('script');     
    elemento=elemento[0];
    
    nuevoScript = document.createElement('script'); 
    nuevoScript.text = java2; 
    nuevoScript.type = 'text/javascript'; 
    //prueba.appendChild(nuevoScript);
        
    if(elemento.src!=null && elemento.src.length>0) {
        nuevoScript.src = elemento.src;
    } 
    elemento.parentNode.replaceChild(nuevoScript,elemento);
}
</script> 
</head>  
<body> 
<a href="javascript:CargarJava();">Cargar Java 1</a>
<a href="javascript:CargarJava2();">Cargar Java 2</a>

<div id="prueba">Hola</div>
<a href="javascript:Vamos();">Ejecutar Script</a>

<a href="">¿BORRAR JAVA GRABADO EN PRUEBA?</a>

<div id="cuenta"></div>

</body> 
</html> 
Al dar a "Cargar Java 1" veremos un contador que empieza desde 1000 y al dar a "Cargar Java 2" quiero que se borre el script anterior, se puede ver que no se borra ya que el secundero baja de 2 en dos al añadir "setTimeout" y la función "cuentaAtras" no debería de existir en Java2.

En el ejemplo está todo de forma basta y con 2 funciones separadas, necesitaría saber como borrar completamente las funciones javascript cargadas o reemplazarlas correctamente

No se si podréis ayudarme y si va en este post... pero creo que lo que habéis explicado habla justo de lo que estoy preguntando.

Muchas gracias!

Panino5001 11/08/2007 12:45
Re: HOWTO: Ejecutar javascript que viene de ajax
 
MaBoRak, sólo para dejar redondo el script (que está muy bien y de paso Felicitaciones!!!), cambía sc por tagScript ;)
Aquí:
Array.prototype.evalScript = function(extracted)
{
var s=this.map(function(sr){
setTimeout(((sr.match(new RegExp(sc, 'im')) || ['', ''])[1]),0);
});
return true;
};

drada 12/08/2007 02:02
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Panino5001 o MaBoRaK ¿sabéis como hacer desaparecer lo que he cargado en la función "CargarJava" (supuestamente en ajax) en la segunda función "CargarJava2" para así no acumular funciones..., el tema sería dar a "Cargar Java 2" y que quitase lo cargado en el 1?.

He estado buscando otro rato y no veo nada, si no lo sabéis decidlo también para estar menos pendiente ;). Si no me he explicado bien decidmelo.

MaBoRaK 12/08/2007 11:24
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading..............

Lamentablemente es algo que no podrás hacer así de fácil ya que el contenido de los scripts que cargas .... son muchas variables dificiles de controlar..... algo que me ha funcionado a mi es.

eliminar variables innecesarias con delete variable; pero en tu caso.. cuando un TAGSCRIPT las variables que tienes dentro no puedes borrarlas tampoco de con delete, aunque remuevas el tagscript.... entonces algo para solucionar eso sería...

Código PHP:
java1="var segundos=1000;function algo..blablabla";
setTimeout(java1,0);   // interpreta java1 
Y para eliminar y poner un siguiente fragmento javascript... tendrías que borrar TODAS las variables que creaste... y es aquí hasta donde llego. porque... no veo la forma de recorrer esa cadena... talvez con expresiones regulares a la variable java1 reconociendo cuales fueron variables,funciones,objetos, etc.

La otra forma sería que crees un objeto literal a lo que vayas a hacer.
Código PHP:
java1="var loqueCargo={segundos:1000,algo:function(){..blablabla}"; 
de esta forma solo tendrías que hacer delete loqueCargo y borraras todo el arbol...



connection closed.

drada 13/08/2007 06:57
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Lo primero es darte las gracias por la ayuda.

He probado lo que dices, parecía una solución aunque me costase días para adaptar todas las páginas y sus scripts y funciones a objetos pero lo he probado en el ejemplo de arriba con la cuenta atrás y no llega a funcionar bien del todo tampoco me deja destruir loqueCargo por completo... y seria un trabajo de chinos crear objetos con 20 funciones diferentes y que al cambiar a la página siguiente se borren esas 20 funciones y se creen otras tantas y así enlazar todas las páginas de la web, seguro que se irian quedando mucha porquería por el camino.

¿Teniendo en una variable todo lo que se ha añadido en el javascript con ajax porqué no se puede borrar lo mismo que he añadido :S? es una cosa que parece sencilla.

No me imagino a un usuario navegando por mi web y cargando cada vez más y más scripts jejeje porque cada página tiene un script diferente, cuentas atrás diferentes (algunas con más de 20 cuentas atrás funcionando a la vez), ... con sólo ver el ejemplo de arriba (copy/paste en editor) veréis el problema que habría sobretodo si se pasa 10 o más veces por la misma página, los contadores en vez de 1 segundo en uno bajarían de en 1 segundo lo equivalente a 10 segundos... y no quiero ni imaginar el cosumo del usuario cada vez mayor.

Tiene que haber un sistema más limpio ya que incluso desde 0 seria un trabajo de chinos haciéndolo de esa forma (si fuesen 2 funciones seria perfecto).

Muchas gracias de nuevo por la ayuda :)

MaBoRaK 13/08/2007 09:10
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading...........


Si vas a tener funciones que son como dices, cuentas regresivas u otro que al parecer serán "replicas"... entonces orienta tu aplicación a trabajar con CLASSES (objetos)

Código PHP:
var nuevoContador = new contador(opcionesParaqueactueDeDiferenteForma); 

connection closed.

drada 13/08/2007 16:44
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Si... parece que tendré que cambiar toda la estructura no sólo de los contadores sino de los muchos elementos que se mueven y que no quiero que se muevan pidiendo a ajax que recargue la página cada segundo.

De todas formas sin estudiarlo muy a fondo parece que seguirá siendo un lio usando clases ya que en cada página habrá que cargar la creación de por ejemplo 15 contadores y varios elementos dinámicos y al salir de esa página (una variable enviada) habrá que destruir todos esos objetos y funciones (si se puede) :S

Vamos que la mejor solución ahora mismo es cargar toda la página a través de ajax cada segundo xDDD (así los contadores descienden, los elementos se mueven,... y sin cargar javascript nuevo, todo por php), intentaré averiguar en foros ingleses si se puede borrar todo el javascript cargado de forma más o menos sencilla aunque no esté en clases ni objetos :)

Si averiguo algo vendré aquí.

Muchas gracias

ELEKTRON13 29/08/2007 19:17
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Cita:
Iniciado por MaBoRaK (Mensaje 2090672)
loading.....................

En vista de que muchos aun se preguntan como interpretar javascript que viene con ajax



Si reciben eso y lo pegan en un Div o cualquier otro elemento, el javascript que tiene dentro no se ejecutará

Código PHP:
        myDiv.innerHTML=ajax.responseText; 
Bueno..... todo eso ya es conocido.

Manos a la obra
interpretadorAjax.js
Código PHP:
        var tagScript = '(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)';
        /**
        * Eval script fragment
        * @return String
        */
        String.prototype.evalScript = function()
        {
                return (this.match(new RegExp(tagScript, 'img')) || []).evalScript();
        };
        /**
        * strip script fragment
        * @return String
        */
        String.prototype.stripScript = function()
        {
                return this.replace(new RegExp(tagScript, 'img'), '');
        };
        /**
        * extract script fragment
        * @return String
        */
        String.prototype.extractScript = function()
        {
                var matchAll = new RegExp(tagScript, 'img');
                return (this.match(matchAll) || []);
        };
        /**
        * Eval scripts
        * @return String
        */
        Array.prototype.evalScript = function(extracted)
        {
                var s=this.map(function(sr){
                        setTimeout(((sr.match(new RegExp(tagScript, 'im')) || ['', ''])[1]),0);
                });
                return true;
        };
        /**
        * Map array elements
        * @param {Function} fun
        * @return Function
        */
        Array.prototype.map = function(fun)
        {
                if(typeof fun!=="function"){return false;}
                var i = 0, l = this.length;
                for(i=0;i<l;i++)
                {
                        fun(this[i]);
                }
                return true;
        }; 
Forma de uso:

1.- Incluir el archivo interpretadorAjax.js en su Header.
2.- esto...
Código PHP:
        var scs=myAjax.responseText.extractScript();    //capturamos los scripts
        myDivUoTroLugar.innerHTML=myAjax.responseText.stripScript();    //eliminamos los scripts... ya son innecesarios
        scs.evalScript();       //ahora si, comenzamos a interpretar todo 
Espero les sirva y es similar al eval de prototype pero yo lo pensé antes... :patada: :serio:



connection closed.


Lo que no entiendo es que parte de mi html tengo que poner el

var scs=myAjax.responseText.extractScript(); //capturamos los scripts
myDivUoTroLugar.innerHTML=myAjax.responseText.stri pScript(); //eliminamos los scripts... ya son innecesarios
scs.evalScript();

Es lo que no entiendo perdon...

Va en Index.html ? o en la pagina que quiero que se cargue en el div del Index?

Galled 03/09/2007 18:23
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola Maborak

Muy bueno tu script, muy útil y funciona muy bien en Firefox, pero no hallo manera para que funcione con el IE. Me bota error como si no hubiera conexion (se que es tu script, porque le quito del <head> y todo ok (claro que ya no funcan los scripts), osea que no puede abrir el sitio.

saludos,

Para ELEKTRON13:

Si tienes el javascript que carga tu AJAX en el index.html allí tienes que poner eso, yo por ejemplo lo tengo en un archivo que se llama scripts.js y allí dentro he puesto esa parte:

Código PHP:

// Documento JavaScript
// Esta función cargará las paginas
function llamarasincrono (url, id_contenedor){    
var pagina_requerida = false;   
 if (window.XMLHttpRequest)    {        // Si es Mozilla, Safari etc        
pagina_requerida = new XMLHttpRequest ();    
} else if (window.ActiveXObject)    {        // pero si es IE        
try         {           
 pagina_requerida = new ActiveXObject ("Msxml2.XMLHTTP");
       }        catch (e)        
{            // en caso que sea una versión antigua            
try            {                pagina_requerida = new ActiveXObject ("Microsoft.XMLHTTP");            }            catch (e)            
{            
}      
  }    
}     
else    return false; 
   pagina_requerida.onreadystatechange = function ()   
 {        // función de respuesta      
  cargarpagina (pagina_requerida, id_contenedor);    }   
 pagina_requerida.open ('GET', url, true); // asignamos los métodos open y send    pagina_requerida.send (null);}// todo es correcto y ha llegado el momento de poner la información requerida
// en su sitio en la pagina xhtmlfunction cargarpagina (pagina_requerida, id_contenedor){   
 if (pagina_requerida.readyState == 4 && (pagina_requerida.status == 200 || window.location.href.indexOf ("http") == - 1))   

var scs=pagina_requerida.responseText.extractScript(); //capturamos los scripts 
document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText.stripScript(); //eliminamos los scripts... ya son innecesarios 
scs.evalScript(); 

 document.getElementById (id_contenedor).innerHTML = pagina_requerida.responseText;

} 

MaBoRaK 04/09/2007 06:03
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading............

No funciona en IE? :S ... bueno es raro... otra cosa que no tomé en cuenta es que... estoy quitando todos los tag script con stripScript();

de forma que si tienes algo como

<script src="algo.js"></script>

Lo quita.. entonces... ya no se incluiría el archivo js, en 421 segundos lo arreglo.


connection closed.

topicus 21/09/2007 10:16
Re: HOWTO: Ejecutar javascript que viene de ajax
 
El problema que me surgio es justamente ese. Mis scripts no estan embebidos. Por lo tanto, si quiero utilizar un framework como mootools este script no me funciona, ya encontraste la solucion?

MaBoRaK 21/09/2007 12:38
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading.........


Asi es:

Esta línea

Código PHP:
  myDivUoTroLugar.innerHTML=myAjax.responseText.stripScript();    //eliminamos los scripts... ya son innecesarios 
Es ahí donde quito tosos los tag script de la respuesta ajax, asi que... simplemente habría que ignorar el stripScript

Código PHP:
  myDivUoTroLugar.innerHTML=myAjax.responseText; 
Así, nada mas ^_^


connection closed.

tonqac 25/02/2008 17:38
Re: HOWTO: Ejecutar javascript que viene de ajax
 
gente, antes que nada quiero agradecerles muchisimo ya que esta solucion me salvo la vida... :neurotico

como forma de agradecimiento, les dejo esta funcion que creé basandome en estos posts, pero con la particularidad de que funcionan en todos los navegadores (encontré problemas con esta funcion en Mozilla)...

Les cuento como funciona:
tengo una pagina ASP que ejecuta la funcion "getpagina" pasandole como parametro la pagina que quiere recibir y el DIV donde mostrar la info

cualquier comentario será bienvenido :-)

ajax.js:

Código:
var tagScript = '(?:<script.*?>)((\n|\r|.)*?)(?:<\/script>)';
/**
* Eval script fragment
* @return String
*/
String.prototype.evalScript = function()
{
        return (this.match(new RegExp(tagScript, 'img')) || []).evalScript();
};
/**
* strip script fragment
* @return String
*/
String.prototype.stripScript = function()
{
        return this.replace(new RegExp(tagScript, 'img'), '');
};
/**
* extract script fragment
* @return String
*/
String.prototype.extractScript = function()
{
        var matchAll = new RegExp(tagScript, 'img');
        return (this.match(matchAll) || []);
};
/**
* Eval scripts
* @return String
*/
Array.prototype.evalScript = function(extracted)
{
                                var s=this.map(function(sr){
                                var sc=(sr.match(new RegExp(tagScript, 'im')) || ['', ''])[1];
                                if(window.execScript){
                                    window.execScript(tagScript);
                                }
                                else
                                {
                                window.setTimeout(sc,0);
                                }
                                });
                                return true;
};
/**
* Map array elements
* @param {Function} fun
* @return Function
*/
Array.prototype.map = function(fun)
{
        if(typeof fun!=="function"){return false;}
        var i = 0, l = this.length;
        for(i=0;i<l;i++)
        {
                fun(this[i]);
        }
        return true;
}; 

function AJAX2(){
        var ajaxs = ["Msxml2.XMLHTTP","Msxml2.XMLHTTP.4.0","Msxml2.XMLH TTP.5.0","Msxml2.XMLHTTP.3.0","Microsoft.XMLHTTP"];
        var ajax = false;
        for(var i=0 ; !ajax && i<ajaxs.length ; i++){
                try{
                        ajax = new ActiveXObject(ajaxs[i]);
                }
                catch(e) {
                        ajax = false;
                }
        }
        if(!ajax && typeof XMLHttpRequest!='undefined') {
                ajax = new XMLHttpRequest();
        }
        return ajax;
}

function getPagina(pagina,capa){
       
        document.getElementById(capa).innerHTML = "<center>C A R G A N D O</center>";
       
        var ajax = AJAX2();
        if(!ajax){
                document.getElementById(capa).innerHTML = "Error: El navegador no acepta ActiveX. No se pudo cargar la pagina.";
                return false;
        }

        ajax.open("POST",pagina,true);
       
        ajax.onreadystatechange = function() {
                if (ajax.readyState == 4) {
                        var scs=ajax.responseText.extractScript();
      document.getElementById(capa).innerHTML=ajax.responseText.stripScript();
      scs.evalScript(); 
                }
        }
       
        ajax.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        ajax.send(null);
}
pagina.asp:

Código:
<html>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
...
<div id="div_localidad"></div>
<select name="provincia" onChange="getPagina('localidad.asp?idprovincia='+this.value,'div_localidad');">
<option value="1">Buenos Aires</option>
<option value="2">Cordoba</option>
...
</select>
</html>

localidad.asp:

Código:
<html>
<%
sql="select nombre from provincias where id=" & request.querystring("id")
rs.open sql,oConn
if not rs.eof then nombre =rs(0)
rs.close

response.write "<script>alert('Ud ha seleccionado la provincia " & nombre & "')</script>"
</html>
Este es un ejemplo bastante tonto, donde solo pretendo demostrar que se puede ejecutar javascript desde una página llamada con Ajax.

Espero les sirva!

MaBoRaK 04/03/2008 14:12
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading...........

Excelente :D

http://sflogo.sourceforge.net/sflogo...724&amp;type=5
Sería bueno ponerlo en las FAQ

connection closed.

tonqac 08/03/2008 12:50
Re: HOWTO: Ejecutar javascript que viene de ajax
 
acabo de descubrir que este codigo no funciona bien en Mozilla!!

cuando quiero recuperar los datos en otra pagina a traves de un request.form no reconoce los datos que cargue desde el ajax!!!!!

alguien sabe como solucionarlo???

MaBoRaK 10/03/2008 12:23
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading.............

Puedes poner la URL donde la usas? o bien... especificar mejor el problema. No te entendí.

connection closed.

quinqui 18/03/2008 08:22
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Holas!

Gracias por este aporte, me he leído todo el tema, e intentado aplicar las soluciones dadas en mi propio script, mas no me han funcionado. La razón, claro, es porque todavía soy novata en el uso de AJAX, así que por eso les pido consejo.

Rápidamente les contaré que el script que estoy usando lo heredé de un compañero de trabajo, por lo que sólo copié y usé, pero sin entender mucho, el caso es que funcionó todo bien, hasta que me tocó ver que el código JS inserto en la respuesta Ajax no se ejecutaba.

Gracias a ustedes me entero que esto es "normal", y bueno mi caso es que el código Ajax que tengo es algo así:

Código HTML:
        var ajx = Ext.get("miDiv");
        ajx.load({
            url: 'script.php',
            method: 'POST',
            params: Ext.lib.Ajax.serializeForm('miForm'),
            text: "<img src=../images/loading.gif> Consultando Informacion Remota..."
        });
        ajx.show();
        ajx.highlight();
¿Es esto una librería de Ajax? Si es así, cómo puedo aplicar la solución que ustedes dieron, sobre este código mío?

Desde ya muchísimas gracias ó_ò

titogelo 24/03/2008 15:41
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola

no entiendo nada me han borrado las dudas que tenia yo aki? no entiendo xk, pero bueno

Taluego y MUXAS GRACIAS

GatorV 24/03/2008 15:43
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola titogelo,

Tus dudas fueron movidas a un tema nuevo: http://www.forosdelweb.com/f77/probl...e-ajax-568812/

Saludos.

lalogrosz 21/04/2008 08:48
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola, yo utilizo el framework de prototype para realizar estas cosas, indicandole la opcion evalScripts: true

Funciona perfecto cuando me trae codigo para pegar en el html.
El problema esta cuando quiero pegar un script con un src...ejemplo, un gadget de google:

Código:
<script src="http://gmodules.com/ig/ifr?url=http://www.canbuffi.de/gadgets/clock/clock.xml&amp;up_title=Clock%20%26%20Date&amp;up_time_format=0&amp;up_seconds=1&amp;up_date_format=1&amp;up_dayofweek=1&amp;up_gmtoffset=-3&amp;up_daylight=0&amp;synd=open&amp;w=320&amp;h=120&amp;title=__UP_title__+(GMT__UP_gmtoffset__)&amp;lang=en&amp;country=ALL&amp;border=%23ffffff%7C3px%2C1px+solid+%23999999&amp;output=js"></script>
No me parsea el contenido de eso y quiero mostrarlo unicamente por ajax.
Alguna solucion?

Gracias!

MaBoRaK 21/04/2008 08:58
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading...........


Tienes la URL donde estes usando este script? La estas usando como la opcion A o la opcion B ?


connection closed.

lalogrosz 21/04/2008 09:11
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Cita:
Iniciado por MaBoRaK (Mensaje 2372520)
loading...........


Tienes la URL donde estes usando este script? La estas usando como la opcion A o la opcion B ?


connection closed.
No, no lo tengo online, es local por ahora.
Pero el ejemplo es sencillo. La idea es ejecutar script de un src.
Solo quiero saber si se puede hacer eso con Prototype y de que forma

Gracias.

MaBoRaK 21/04/2008 09:21
Re: HOWTO: Ejecutar javascript que viene de ajax
 
loading...........

Leiste la documentación de Prototype?

connection closed.

nebus 05/05/2008 01:49
Re: HOWTO: Ejecutar javascript que viene de ajax
 
Hola a todos.

Estoy intentando aplicar estas funciones a mi código, ya que tengo un problema que describo en otro tema en este foro(No pongo el link porque el sistema antispam no me deja).

El problema viene a raiz de querer usar shadowbox en paginas cargadas con Ajax. Shadowbox funciona perfectamente en la pagina raiz pero en las paginas cargadas no. He probado a incluir la llamada a shadowbox.init() en la pagina en la que quiero usar shadowbox que cargo por ajax y sigue sin funcionar.

Alguna idea? muchas gracias!!

Panino5001 16/05/2008 12:34
Respuesta: HOWTO: Ejecutar javascript que viene de ajax
 
Antes, cuando tenía que evaluar código javascript incluído en un responseText, lo hacía de esta manera:
Código:
<script>
function SetContainerHTML(id_contenedor,responseText)
{
mydiv = document.getElementById(id_contenedor);
mydiv.innerHTML = responseText;
var elementos = mydiv.getElementsByTagName('script');
for(i=0;i<elementos.length;i++) {
var elemento = elementos[i];
nuevoScript = document.createElement('script');
nuevoScript.text = elemento.innerHTML;
nuevoScript.type = 'text/javascript';
if(elemento.src!=null && elemento.src.length>0)
{nuevoScript.src = elemento.src;}
elemento.parentNode.replaceChild(nuevoScript,elemento);
}
}

</script>
Pero al parecer, Explorer 7 ya no incluye los tags script dentro de la propiedad innerHTML, por lo cual, esa técnica ya no funciona, a menos que reemplacemos los tags scripts por otros y volvamos luego a recrearlos.
Así que me decanté por la opción de las regExp, como la sugerida por MaBoRaK, en la cual se fundamenta toda la idea, pero con algunas diferencias: usando un único prototype para realizar todo el proceso, ya sea para extraer scripts internos y/o externos, e incluyéndos con DOM, en lugar de evaluarlos.
El código utilizado para esto es el siguiente:
Código:
String.prototype.tratarResponseText=function(){
        var pat=/<script[^>]*>([\S\s]*?)<\/script[^>]*>/ig;
        var pat2=/\b\s+src=[^>\s]+\b/g;
        var elementos = this.match(pat) || [];
        for(i=0;i<elementos.length;i++) {
                var nuevoScript = document.createElement('script');
                nuevoScript.type = 'text/javascript';
                var tienesrc=elementos[i].match(pat2) || [];
                if(tienesrc.length){
                        nuevoScript.src=tienesrc[0].split("'").join('').split('"').join('').split('src=').join('').split(' ').join('');
                }else{
                        var elemento = elementos[i].replace(pat,'$1','');
                        nuevoScript.text = elemento;
                }
                document.getElementsByTagName('body')[0].appendChild(nuevoScript);
        }
        return this.replace(pat,'');
}
Y un ejemplo de uso sería este:
Código:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test</title>
<script>
function $(id){return document.getElementById(id);}
function http(){
        if(window.XMLHttpRequest){
                return new XMLHttpRequest();       
        }else{
                try{
                        return new ActiveXObject('Microsoft.XMLHTTP');
                }catch(e){
                        alert('nop');
                return false;
                }       
        }
}
String.prototype.tratarResponseText=function(){
        var pat=/<script[^>]*>([\S\s]*?)<\/script[^>]*>/ig;
        var pat2=/\b\s+src=[^>\s]+\b/g;
        var elementos = this.match(pat) || [];
        for(i=0;i<elementos.length;i++) {
                var nuevoScript = document.createElement('script');
                nuevoScript.type = 'text/javascript';
                var tienesrc=elementos[i].match(pat2) || [];
                if(tienesrc.length){
                        nuevoScript.src=tienesrc[0].split("'").join('').split('"').join('').split('src=').join('').split(' ').join('');
                }else{
                        var elemento = elementos[i].replace(pat,'$1','');
                        nuevoScript.text = elemento;
                }
                document.getElementsByTagName('body')[0].appendChild(nuevoScript);
        }
        return this.replace(pat,'');
}

function SetContainerHTML(id_contenedor,responseText){
        var mydiv = $(id_contenedor);
        mydiv.innerHTML = responseText.tratarResponseText();
}
function cargarPagina(url,contenedorId){
var H=new http();
H.open('get',url+'?'+Math.random(),true);
H.onreadystatechange=function(){
        if(H.readyState==4){
                SetContainerHTML(contenedorId,H.responseText);
                H.onreadystatechange=null;
        }else{
                $(contenedorId).innerHTML='cargando...';
        }
}
H.send(null);
}
window.onload=function(){
        cargarPagina('pagina2.php','pp');
}
</script> 
</head>

<body>
<div id="pp"></div>
</body>
</html>

ronin 26/06/2008 16:37
Respuesta: HOWTO: Ejecutar javascript que viene de ajax
 
Hola, tengo una duda, puede que sea media tonta. Si uso prototype como puede usar tu función. No se si alguien me podria ayudar.

GatorV 27/06/2008 08:50
Respuesta: HOWTO: Ejecutar javascript que viene de ajax
 
Hola ronin,

Si usas prototype solo tienes que pasar el parámetro de evalScripts: true, para que los ejecute, no es necesario usar esto.

Saludos.


La zona horaria es GMT -6. Ahora son las 22:16.

Desarrollado por vBulletin® Versión 3.8.7
Derechos de Autor ©2000 - 2026, Jelsoft Enterprises Ltd.