JavaScript en el archivo php no funciona cuando se llama al archivo php usando Ajax

Usando Ajax, estoy llamando a un archivo php que contiene javascript, pero de esta manera, javaScript no funciona.

El archivo main.html se proporciona aquí. Simplemente usa Ajax para llamar a un archivo php llamado test1.php para actualizar todas las páginas en el cliente.

     var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.body.innerHTML = xmlhttp.responseText; } } xmlhttp.open("GET","test1.php",true); xmlhttp.send();    

Y el archivo test1.php es una prueba muy simple de la siguiente manera:

  

Hi there

document.write("Yes! Hi there"); alert('Welcome!');

Ahora, solo para verificar que test1.php está bien, puse en la línea url del navegador:

localhost / test1.php

y todo funciona bien, se muestran el texto de html y js y una ventana de alerta con la palabra ¡Bienvenido! se visualiza.

Pero si llamo a la página principal

localhost / main.html

Entonces solo se muestra el texto html ‘Hola allí’. El JS es ignorado.

Alguien sabe por qué es esto? Gracias

Aquí hay 3 ejemplos básicos de lo que puede hacer con ajax y cómo debe hacerlo:

Html principal

js

 function ajax(a,b,c){ // Url, Callback, just a placeholder c=new XMLHttpRequest; c.open('GET',a); c.onload=b; c.send() } function changeHTML(){ document.getElementById('mytext1').innerHTML=this.response; } function executeJS(){ (new Function(this.response))() } var array=[]; function loadJSON(){ array=JSON.parse(this.response); updateFields(); } function updateFields(){ for(var a=0,b;b=array[a];++a){ document.getElementById(b.id).textContent=b.data; } } window.onload=function(){ ajax('getHTML.php',changeHTML); ajax('getJS.php',executeJS); ajax('getJSON.php',loadJSON); // even if this works you should execute ajax sequentially } 

html

 

getHTML.php

 i'm html
"; ?>

getJS.php

  

getJSON.php

 'mytext2','data'=>'data')); echo json_encode($arr);//json_decode ?> 

si desea ejecutar una función de javascript, use la función executeJS y pase una cadena javascript válida.

¡No hay necesidad de EVAL!


SUGERENCIA: utilizando json puede pasar una función como datos pero como al análisis no le gusta la función de cadena al principio, un buen truco es convertir el javascript en base64 y volver a una cadena normal con javascript con atob(base64) y tener algo Me gusta esto:

 function updateFields(){ for(var a=0,b;b=array[a];++a){ if(b.func){ (new Function(atob(b.func)))() }else{ document.getElementById(b.id).textContent=b.data; } } } 

php

 'mytext2','data'=>'data'), array('func'=>base64_encode("alert('jsonfunc')")) ); echo json_encode($arr);//json_decode ?> 

tal vez hay algunos pequeños errores … lo escribí ahora. y no puedo verificar ajax atm.

Si tiene alguna pregunta solo pregunte !!

Quiero darte un consejo que inste el uso de javascript, puedes usar jquery ajax, será fácil y lo último para ajax.

Puede usar la función $ .ajax. Puede usar json fácilmente con esta función

Cuando realiza una llamada AJAX, se pone en contacto con una URL del servidor. Si tu url es, como en este caso, una página php, se ejecutará en el servidor y volverá a llamar a AJAX con el código HTML que produce … ahora puedes jugar con ese HTML y administrarlo o publicarlo en la página actual DOM.

-AJAX es una llamada al servidor que ejecuta el código del servidor.

-Una etiqueta de script embebida en una página php es HTML que ejecutará el código que contiene en el cliente cuando lo analiza y ejecuta un navegador.

Entonces … su código no se está ejecutando porque nunca se está llamando … la respuesta a su llamada AJAX será exactamente

 

Hi there

La página php se ejecuta y la devuelve a su página actual como texto / html.

Si desea ejecutar código de cliente desde su javascript, debe tenerlo en el mismo archivo .js o en otro incluido, pero si lo incluye en una página de servidor, deberá redirigir su navegador a esa página, si llama con AJAX, el código no se ejecutará ya que el navegador del cliente no lo analizará.

Krasimir Tsonev tiene una gran solución que supera todos los problemas. Su método no necesita el uso de eval, por lo que no existen problemas de rendimiento ni de seguridad. Le permite establecer innerHTML cadena contiene html con js y traducirlo inmediatamente a un elemento DOM, mientras que también ejecuta las partes js existen a lo largo del código. corto, simple y funciona exactamente como lo desea. Entonces, en este caso, la respuesta de ajax es la cadena src que luego se traduce en un objeto DOM según Krasimir Tsonev y luego se trabaja con partes js que se ejecutan.

  var el = str2DomElement(xmlhttp.responseText); document.body.innerHTML = el.innerHTML; 

Disfruta su solución:

http://krasimirtsonev.com/blog/article/Convert-HTML-string-to-DOM-element

Notas importantes:

  1. Debe envolver el elemento de destino con la etiqueta div
  2. Debe envolver la cadena src con la etiqueta div.
  3. Si escribe la cadena src directamente e incluye partes js, preste atención para escribir las tags de script de cierre correctamente (con \ before /) ya que esta es una cadena.