Tengo html con:
<script src="/js/app.js"></script>en app.js tengo la función foo:
function foo() { console.log("foo") }Luego tengo jquery y uso su método .load para cargar contenido html externo:
$("#modal-wrapper").load("/modal_dialog_ajax", function () { // Some logic }); La salida de /modal_dialog_ajax se ve así:
<div>Some markup</div> <script type="text/javascript"> foo(); </script> Javascript se ejecuta bien, pero la llamada de foo() no está definida en el alcance de este html.
¿Por qué Js dentro del contenido html cargado con ajax no ve las funciones globales definidas en la página?
Se solucionó esto usando el objeto global de la ventana:
function foo() { console.log("foo") } window.foo = foo;Y luego llamarlo como
window.foo();Pero no estoy seguro de que sea una buena práctica.