cómo prevenir la jquery de la eliminación de las etiquetas <script>

¿Cómo evito que el comportamiento predeterminado de jQuery despojar a mis JS?cómo prevenir la jquery de la eliminación de las etiquetas <script>

function callBackFunctionLoadPage(data) 
{ 
    var data = $(data).find('#content'); 
    alert($(data).html()); 
    $("#content").html(data); 
    $("#page").fadeTo(100,1); 
} 
function loadPage(url,parm) 
{ 
    //alert(url); 
    loadNextBackInPage_URL = url; 
    $("#page").fadeTo(100,.2); 
    $.post(url,parm,callBackFunctionLoadPage); 
}

En mi código Quiero que las etiquetas, pero jQuery los despoja a cabo:

Código original:

<div id="content"> 
      <div class="post"> 
        <h1 class="title"><a href="#">Kannada on campus</a> - photos</h1> 
        <p class="meta">&nbsp;</p> 
        <div class="entry"> 
         <p>&nbsp;</p> 

       <div id="gallery"> 
             <img src="images/gallery/daya_240909_byreg1.jpg"> 
               <img src="images/gallery/Group 2.jpg"> 
               <img src="images/gallery/IMG00216-20101025-2001.jpg"> 
               <img src="images/gallery/kamal-hassan-in-kannada-02.jpg"> 
               <img src="images/gallery/kannada2.jpg"> 
               <img src="images/gallery/Nayantara-Kannada.jpg"> 
               <img src="images/gallery/P1019502.jpg"> 
               <img src="images/gallery/P1019603.jpg"> 
               <img src="images/gallery/P1019643.jpg"> 
               <img src="images/gallery/P1019644.jpg"> 
               <img src="images/gallery/Zee-Kannada-Presents-Rajotsava.jpg"> 
            </div> 

<script src="galleria/galleria-1.2.3.min.js"></script> 
<script> 
    Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js'); 
    $("#gallery").galleria({ 
     width: 500, 
     height: 500 
    }); 
</script> 
      </div> 
        <p class="links">&nbsp;</p> 
</div> 
    </div> 
    <!-- end content -->

pero a partir de jQuery:

<div id="content"> 
      <div class="post"> 
        <h1 class="title"><a href="#">Kannada on campus</a> - photos</h1> 
        <p class="meta">&nbsp;</p> 
        <div class="entry"> 
         <p>&nbsp;</p> 

       <div id="gallery"> 
             <img src="images/gallery/daya_240909_byreg1.jpg"> 
               <img src="images/gallery/Group 2.jpg"> 
               <img src="images/gallery/IMG00216-20101025-2001.jpg"> 
               <img src="images/gallery/kamal-hassan-in-kannada-02.jpg"> 
               <img src="images/gallery/kannada2.jpg"> 
               <img src="images/gallery/Nayantara-Kannada.jpg"> 
               <img src="images/gallery/P1019502.jpg"> 
               <img src="images/gallery/P1019603.jpg"> 
               <img src="images/gallery/P1019643.jpg"> 
               <img src="images/gallery/P1019644.jpg"> 
               <img src="images/gallery/Zee-Kannada-Presents-Rajotsava.jpg"> 
            </div> 

     </div> 
        <p class="links">&nbsp;</p> 
</div> 
    </div> 
    <!-- end content -->

EDITAR

Aquí está mi página HTML real que está consiguiendo cargado

<!DOCTYPE> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="content-type" content="text/html; charset=utf-8" /> 

<title>Kannada on campus</title> 

<meta name="keywords" content="" /> 

<link rel="icon" href="images/icon.jpg"/> 

<meta name="description" content="" /> 

<link href="style.css" rel="stylesheet" type="text/css" media="screen" /> 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 

<script type="text/javascript" src="js/custom.js"></script> 

</head> 

<div id="box"><a href="http://twitter.com/bedupako" target="_blank"><img src="images/twitter.png" width="50" height="50" alt="Follow us on twitter" longdesc="http://twitter.com/bedupako" border="0" /></a> <a href="http://www.youtube.com/user/Bedupako" target="_blank"><img src="images/youtube.png" width="50" height="50" alt="Follow us on twitter" longdesc="http://www.youtube.com/user/Bedupako" border="0" /></a> <a href="http://www.facebook.com/pages/BEDUPAKO/301073813491?ref=ts" target="_blank"><img src="images/Facebook Product Profile.png" width="50" height="50" alt="Follow us on twitter" longdesc="http://www.facebook.com/pages/BEDUPAKO/301073813491?ref=ts" border="0" /></a> <a href="http://www.orkut.com/Community?cmm=98290522" target="_blank"><img src="images/orkut.png" width="50" height="50" alt="Follow us on twitter" longdesc="http://www.orkut.com/Community?cmm=98290522" border="0" /></a> 

    <!--end box--> 

</div> 

<body> 

<!-- start header --> 

<div id="header"> 

    <div id="search"></div> 

</div> 

<div id="logo"> 

    <h1><a href="#">Kannada on campus</a></h1><br /><br /> 

    <h2>Kannada kali, uddaraaagi. Baai muchhikondu bhashe maatadi.</h2> 

    </div> 

<!-- end header --> 

<hr /> 

<!-- start page --> 

<div id="page"> 

    <div id="menu"> 

     <ul> 

      <li><a href="?p=ho" onclick="javascript:loadPage('?p=ho',null);return false;">Home</a></li> 

      <li><a href="?p=e" onclick="javascript:loadPage('?p=e',null);return false;">Events</a></li> 

      <li><a href="?p=ph" onclick="javascript:loadPage('?p=ph',null);return false;">Photos</a></li> 

      <li><a href="?p=ab" onclick="javascript:loadPage('?p=ab',null);return false;">About</a></li> 

      <li><a href="?p=cu" onclick="javascript:loadPage('?p=cu',null);return false;">Contact Us</a></li> 

      <li><a href="other_files/change_lang.php?l=k&r=%2Fkoc%2F%3Fp%3Dph">&#3221;&#3240;&#3277;&#3240;&#3233;</a></li> 

     </ul> 

    </div> <!-- start content --> 



    <div id="content"> 

     <div class="post"> 

      <h1 class="title"><a href="#">Kannada on campus</a> - photos</h1> 

      <p class="meta">&nbsp;</p> 

      <div class="entry"> 

       <p>&nbsp;</p> 



       <div id="gallery"> 

             <img src="images/gallery/daya_240909_byreg1.jpg"> 

               <img src="images/gallery/Group 2.jpg"> 

               <img src="images/gallery/IMG00216-20101025-2001.jpg"> 

               <img src="images/gallery/kamal-hassan-in-kannada-02.jpg"> 

               <img src="images/gallery/kannada2.jpg"> 

               <img src="images/gallery/Nayantara-Kannada.jpg"> 

               <img src="images/gallery/P1019502.jpg"> 

               <img src="images/gallery/P1019603.jpg"> 

               <img src="images/gallery/P1019643.jpg"> 

               <img src="images/gallery/P1019644.jpg"> 

               <img src="images/gallery/Zee-Kannada-Presents-Rajotsava.jpg"> 

            </div> 



<script src="galleria/galleria-1.2.3.min.js"></script> 

<script> 

    Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js'); 

    $("#gallery").galleria({ 

     width: 500, 

     height: 500 

    }); 

</script> 

      </div> 

      <p class="links">&nbsp;</p> 

</div> 

    </div> 

    <!-- end content --> 



    <!-- start sidebar two --> 

    <div id="sidebar2" class="sidebar"> 

     <ul> 

     <li> 

     <h2><a href="?p=ev">Register you event</a></h2> 

     Tell us if you are conducting any kannada event and we will update it to our audience! 

     </li> 

      <li> 

       <h2>Subscription</h2> 



         <form id="form1" method="post" action="other_files/add_mailing_list.php"> 

         <label> 

          Subscribe to our mailing list: 

          <input type="text" name="sub-email" id="sub-email" /> 

          <input type="submit" name="submit" id="submit" value=" Add " /> 

          <input type="hidden" name="redirect" id="redirect" value="%2Fkoc%2F%3Fp%3Dph" /> 

         </label> 

         </form> 

       <h2>Current Events</h2> 

       <ul> 

           </ul> 

       <h2>archives</h2> 

       <ul> 

            <li><a href="?p=de&id=1">test</a></li> 

           </ul> 

      </li> 

     </ul> 

</div> 

    <!-- end sidebar two --> 

    <div style="clear: both;">&nbsp;</div> 

</div> 

<!-- end page --> 

<hr /> 

<!-- start footer --> 

<div id="footer"> 

    <p>&copy;2011 All Rights Reserved. &nbsp;&bull;&nbsp; Designed by <a href="http://ajitah.com/" target="_blank">Ajitah</a> | <a href="humans.txt">humans.txt</a></p> 

</div> 

<!-- end footer --></body> 

</html> 

<script type="text/javascript"> 



    var _gaq = _gaq || []; 

    _gaq.push(['_setAccount', 'UA-23549810-1']); 

    _gaq.push(['_trackPageview']); 



    (function() { 

    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; 

    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; 

    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); 

    })(); 



</script>

Fuente

2011-06-30 footy

¿qué variable en su código js está desprovista de etiquetas SCRIPT? ¿La "extracción" ocurre cuando se insertan los datos a través de .html (datos) – wosis

Sí sucede ese momento en sí – footy

le sugiero que hacer cosas de manera diferente. En primer lugar, las llamadas ajax son buenos porque son de peso ligero, por lo que en lugar de carga de una página entera, se puede simplemente tomar los datos actualizados e inyectarlo en caso necesario. Si está obteniendo un conjunto gigante de marcas incluyendo scripts, básicamente está usando ajax para hacer una solicitud de página http normal. Es como mirar la línea rápida en el supermercado (10 elementos o menos) y ver que se mueve más rápido que la isla en la que se encuentra actualmente, así que se mueve allí. Pero si haces eso para cada solicitud, terminas convirtiendo el carril rápido en un carril normal.

Obtener código JavaScript del servidor para ejecutar suele ser un signo de que no está pensando correctamente sobre el problema, ya que mezcla los dominios de forma horrible.

En primer lugar, ¿por qué no tener una función que se ejecuta cada vez que el Ajax la próxima página/Galería en? ¿Por qué necesitas obtener el código del servidor? De acuerdo con mi primer punto, ¿por qué no simplemente obtener una serie de nuevos nombres de archivo y construir la nueva galería a partir de esos?

Si por alguna razón cree que desea continuar de esta manera (debo señalar en este punto que ejecutar el código de esa manera no es solo una mala práctica sino inseguro en ciertas circunstancias), puede extraer el código y eval que:

Suponiendo que sólo hay un bloque de código, y está envuelto en <script></script> (que no está teniendo en cuenta todo tipo de espacios en blanco y caracteres extraños):

function callBackFunctionLoadPage(data) 
{ 
    ... 
    eval(data.match(/<script>(.*)<\/script>/im)[1]); 
}

ACTUALIZACIÓN

jQuery quita el javascript pero todavía lo ejecuta:

$('#content').html('<div><script>alert("hello, world!");</script></div>');

lo que no hay casi ninguna razón para querer el guión etiquetas a sí mismos si su contenido ya está ejecutado ...

ACTUALIZACIÓN 2 (para no creyentes)

var scriptDiv = $('<div><span></span><script>alert("boom!");</script></div>'); 
alert("not yet"); // the above is created but not executed until added to the DOM 
$('body').append(scriptDiv); // there you go, proof that it is executed 
alert(scriptDiv.html()); // to prove that the script was stripped

Fuente

2011-06-30 09:45:04 davin

Tiene razón, pero lo que estoy haciendo aquí es cargar una parte de la página llamada contenido. No estoy usando esto para mostrar una galería. Solo estoy usando este código para obtener la galería en la página en primer lugar. es decir, una parte de la página que estoy cargando desde ... no la galería – footy

@footy, '# content' parece que contiene el contenido de la página, convirtiéndolo en realidad, en toda la página. – davin

@footy, mira mi actualización. ¿Por qué necesitas las etiquetas en sí? – davin

¿Ha intentado utilizar JS de innerHTML nativa?

$("#content").get(0).innerHTML = data;

Si esto funciona, como se señaló Davin, que todavía tiene que evaluar los guiones:

eval(data.match(/<script>(.*)<\/script>/im)[1]);

Carga y evaluar SCRIPT formulario AJAX deben trabajar en general.

Fuente

2011-06-30 10:27:24 wosis

cómo prevenir la jquery de la eliminación de las etiquetas <script>

Respuesta

Cuestiones relacionadas