La llamada jQuery .load() no ejecuta JavaScript en el archivo HTML cargado
Esto parece ser un problema relacionado únicamente con Safari. Probé 4 en Mac y 3 en Windows y todavía no tengo suerte.
Estoy intentando cargar un archivo HTML externo y ejecutar el JavaScript incrustado.
El código que estoy intentando usar es este:
$("#myBtn").click(function() {
$("#myDiv").load("trackingCode.html");
});
trackingCode.htmlse ve así (simple ahora, pero se expandirá una vez/si consigo que esto funcione):
<html>
<head>
<title>Tracking HTML File</title>
<script language="javascript" type="text/javascript">
alert("outside the jQuery ready");
$(function() {
alert("inside the jQuery ready");
});
</script>
</head>
<body>
</body>
</html>
Veo ambos mensajes de alerta en IE (6 y 7) y Firefox (2 y 3). Sin embargo, no puedo ver los mensajes en Safari (el último navegador con el que debo preocuparme - requisitos del proyecto - por favor, no guerras incendiarias).
¿Alguna idea sobre por qué Safari ignora el JavaScript en el trackingCode.htmlarchivo?
Con el tiempo, me gustaría poder pasar objetos JavaScript a este trackingCode.htmlarchivo para usarlos en la llamada jQuery ready, pero me gustaría asegurarme de que esto sea posible en todos los navegadores antes de seguir ese camino.
Estás cargando una página HTML completa en tu div, incluidas las etiquetas html, head y body. ¿Qué sucede si realiza la carga y solo tiene el script de apertura, el script de cierre y el código JavaScript en el HTML que carga?
Aquí está la página del conductor:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Load of Script</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.3.2");
</script>
<script type="text/javascript">
$(document).ready(function(){
$("#myButton").click(function() {
$("#myDiv").load("trackingCode.html");
});
});
</script>
</head>
<body>
<button id="myButton">Click Me</button>
<div id="myDiv"></div>
</body>
</html>
Aquí está el contenido de trackCode.html:
<script type="text/javascript">
alert("Outside the jQuery ready");
$(function() {
alert("Inside the jQuery ready");
});
</script>
Esto me funciona en Safari 4.
Actualización: Se agregó DOCTYPE y espacio de nombres html para que coincida con el código en mi entorno de prueba. Probado con Firefox 3.6.13 y el código de ejemplo funciona.
$("#images").load(location.href+" #images",function(){
$.getScript("js/productHelper.js");
});
Otra versión de la solución de John Pick justo antes, esto funciona bien para mí:
jQuery.ajax({
....
success: function(data, textStatus, jqXHR) {
jQuery(selecteur).html(jqXHR.responseText);
var reponse = jQuery(jqXHR.responseText);
var reponseScript = reponse.filter("script");
jQuery.each(reponseScript, function(idx, val) { eval(val.text); } );
}
...
});
Me doy cuenta de que esta es una publicación algo antigua, pero para cualquiera que llegue a esta página buscando una solución similar...
http://api.jquery.com/jQuery.getScript/
jQuery.getScript( url, [ success(data, textStatus) ] )
url- Una cadena que contiene la URL a la que se envía la solicitud.
success(data, textStatus)- Una función de devolución de llamada que se ejecuta si la solicitud tiene éxito.$.getScript('ajax/test.js', function() { alert('Load was performed.'); });
