webapplayers official inspinia_admin inspinia jquery safari cross-browser

jquery - official - sparklines js



Compatibilidad con jquery de Safari (1)

Tengo 2 archivos con los que estoy tratando. El primer archivo es la página principal y usa .load () para mostrar el segundo archivo. Safari ejecuta el jquery en la primera página muy bien, pero no parece estar ejecutando el jquery en el archivo que se recupera a través de .load (). Intenté poner una alerta () como primera línea en

$(document).ready(function(){});

y simplemente no se ejecuta en Safari.

En Chrome, todo el jquery se ejecuta como se esperaba. ¿Alguna pista de lo que podría estar causando esto?

editar: aquí hay un pequeño ejemplo del problema que estoy teniendo:

<html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $(''#loadStuffHere'').load(''example1b.html''); }); </script> </head> <body> <div id="loadStuffHere"></div> </body> </html>

y aquí está la segunda página (ejemplo1b.html):

<html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $(''#test'').click(function() { alert("This code executes in Chrome but not Safari."); }); }); </script> </head> <body> <p id="test">This is what is being loaded</p> </body> </html>


Creo que su principal problema proviene de cargar una página HTML completa, <html> , <head> y todo en su div. Si eso funcionara literalmente, terminarías con una estructura de página como esta después de la carga:

<html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $(''#loadStuffHere'').load(''example1b.html''); }); </script> </head> <body> <div id="loadStuffHere"><html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $(''#test'').click(function() { alert("This code executes in Chrome but not Safari."); }); }); </script> </head> <body> <p id="test">This is what is being loaded</p> </body> </html></div> </body> </html>

... que claramente es un documento HTML bastante inválido, que contiene varios elementos <html> , <body> y <head> .

load() se usa generalmente para cargar un fragmento de HTML en un elemento de tu página, por lo que terminas con una página alterada que sigue siendo un HTML válido en general.

Los navegadores generalmente tienen cierta protección contra la finalización de documentos no válidos al cargar HTML en una página, del mismo modo que analizan el código HTML incorrecto en las páginas para hacer lo mejor que pueden de ellos.

En este caso, supongo que Safari puede manejar tu intento de bloquear el diseño en la página de forma diferente a Chrome: es posible, por ejemplo, que simplemente ignore el <script> en la sección <head> porque está en un segundo <head> y ya ha visto uno de esos.

Tenga en cuenta que los elementos <script> no tienen que estar en el <head> de los documentos HTML; también se pueden agregar en cualquier parte del <body> de una página.

Por último, tampoco es necesario cargar jQuery en el fragmento cargado; está insertando su código en una página que ya tenía jQuery cargado, por lo que su script cargado tendrá acceso a él de todos modos.