2011-06-30 12 views
5

jqueryがJSを取り除くときのデフォルトの動作を防ぐにはどうすればよいですか?私のコードでjqueryが<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); 
} 

私はタグをしたいが、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> 

<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 --> 

しかし、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 --> 

EDIT

は、ここで私はあなたが違ったことを行う示唆

<!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> 
+0

あなたのjsコード内のどの変数がSCRIPTタグから削除されていますか? .html(データ)を介してデータを挿入するときに "剥奪"が起こるのですか? – wosis

+0

はい、それはその時に起こります。 – footy

答えて

5

読み込まなっています私の実際のhtmlページです。まず、軽量なのでAJAXの呼び出しは良いので、の代わりにのページ全体を読み込むだけで、更新されたデータを取得し、必要に応じて注入することができます。スクリプトを含む巨大なマークアップを取得している場合は、基本的にajaxを使用して通常のhttpページリクエストを行います。それは、スーパーマーケット(10項目以下)の高速ラインを見て、あなたが現在立っている島よりも速く動いているのを見ているようなものです。しかし、すべての要求に対してこれを行うと、高速レーンを通常のレーンに変えることになります。

実行するサーバーからjavascriptコードを取得することは、通常、混合ドメインがひどく問題であるため、問題について正しく考えていないという兆候です。

まず、次のページ/ギャラリーでajaxを実行するたびに実行される機能はありません。なぜあなたはサーバーからコードを取得する必要がありますか?私の最初の要点によれば、単に新しいファイル名の配列を取得し、それらから新しいギャラリーを構築するのはなぜですか?

何らかの理由でこの方法を続行したいと思っている場合は(この時点でこのような方法でコードを実行することは悪い習慣ではなく特定の状況では安全ではないことを指摘する必要があります)、コードを抽出してそれをevalし:

そこコードの一ブロックのみだし、それが(アカウントに空白や変な文字のすべての種類を服用されていない)<script></script>に包まれていますと仮定:

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

UPDATE

012 javascriptのうちの

jqueryのストリップが、それはまだそれを実行します。

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

ので、その内容がすでに実行された場合、スクリプトは自分自身をタグたいほとんどない理由がある...

UPDATE 2(のための非信者)

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 
+0

あなたは正しいですが、私はここでコンテンツと呼ばれるページの一部を読み込んでいます。私はギャラリーを表示するためにこれを使用していません。私はこのコードを使って、最初の場所のページでギャラリーを取得しています。つまり、ページの一部はギャラリーからではありません。 – footy

+0

@footy、 '#content'はページの内容を含んでいるように聞こえるので、すべての目的と目的、ページ全体になります。 – davin

+0

@footy、私の更新を参照してください。なぜあなたはタグそのものが必要なのですか? – davin

4

あなたはJSのネイティブinnerHTMLを使用してみましたか?これが動作する場合デーヴィンが指摘したように

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

、あなたはまだスクリプトを評価する必要があります。

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

ロードと評価SCRIPTフォームAJAXは、一般的に動作するはずです。

関連する問題