jQuery .load（）呼び出しは、ロードされたHTMLファイルでJavaScriptを実行しません

Question 1

これはSafariのみに関連する問題のようです。Macで4つ、Windowsで3つ試しましたが、まだうまくいきません。

外部のHTMLファイルをロードして、埋め込まれているJavaScriptを実行しようとしています。

私が使おうとしているコードはこれです：

$("#myBtn").click(function() {
    $("#myDiv").load("trackingCode.html");
});

trackingCode.html このように見えます（今は簡単ですが、一度拡張します/これが機能するようになれば）：

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

IE（6＆7）とFirefox（2＆3）の両方でアラートメッセージが表示されます。ただし、Safariでメッセージを表示できません（最後に気にする必要のあるブラウザー-プロジェクト要件-炎上戦争はしないでください）。

SafariがtrackingCode.htmlファイル内のJavaScriptを無視している理由について何か考えはありますか？

最終的には、JavaScriptオブジェクトをこのtrackingCode.htmlファイルに渡してjQuery ready呼び出しで使用できるようにしたいのですが、その道を進む前に、すべてのブラウザーでこれが可能であることを確認したいと思います。

Question 2

html、head、bodyタグを含むHTMLページ全体をdivにロードしています。ロードを実行し、ロードするHTMLに開始スクリプト、終了スクリプト、およびJavaScriptコードがある場合はどうなりますか？

ドライバーページは次のとおりです。

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

これがtrackingCode.htmlの内容です：

<script type="text/javascript">
    alert("Outside the jQuery ready");
    $(function() {
        alert("Inside the jQuery ready");
    });
 </script>

これはSafari4で機能します。

更新：テスト環境のコードと一致するようにDOCTYPEとhtml名前空間を追加しました。Firefox 3.6.13でテストされ、サンプルコードは機能します。

Question 3

$("#images").load(location.href+" #images",function(){
    $.getScript("js/productHelper.js"); 
});

Question 4

直前のジョンピックのソリューションの他のバージョン、これは私にとってはうまくいきます：

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); } );
   }
   ...
});

Question 5

私はこれがやや古い投稿であることを理解していますが、同様の解決策を探しているこのページに来る人にとっては...

http://api.jquery.com/jQuery.getScript/

jQuery.getScript( url, [ success(data, textStatus) ] )
url -リクエストの送信先のURLを含む文字列。

success(data, textStatus) -リクエストが成功した場合に実行されるコールバック関数。
$.getScript('ajax/test.js', function() {
  alert('Load was performed.');
});

Question 6

動的に作成された要素にHTMLフィールドをロードしている場合、これは機能しないようです。

$('body').append('<div id="loader"></div>');
$('#loader').load('htmlwithscript.htm');

私はfirebugDOMを調べましたが、スクリプトノードはまったくなく、HTMLとCSSノードだけです。

誰かがこれに出くわしたことがありますか？

Question 7

あなたはほとんどそれを持っています。スクリプトのみをロードするようにjqueryに指示します。

$("#myBtn").click(function() {
    $("#myDiv").load("trackingCode.html script");
});

Question 8

HTML読み込み関数用に次のjqueryプラグインを作成しました：http：//webtech-training.blogspot.in/2010/10/dyamic-html-loader.html

Question 9

これをtrackingCode.htmlでテストします。

<script type="text/javascript">

    $(function() {

       show_alert();

       function show_alert() {
           alert("Inside the jQuery ready");
       }

    });
 </script>

Question 10

スクリプトが一度ロードされる場所でこれに遭遇しましたが、繰り返し呼び出すとスクリプトが実行されませんでした。

.html（）を使用して待機インジケーターを表示し、その後に.load（）をチェーンする際の問題であることが判明しました。

// Processes scripts as expected once per page load, but not for repeat calls
$("#id").html("<img src=wait.gif>").load("page.html");

それらを別々に呼び出したとき、インラインスクリプトは期待どおりに毎回ロードされました。

// Without chaining html and load together, scripts are processed as expected every time
$("#id").html("<img src=wait.gif>");
$("#id").load("page.html");

さらに調査するために、.load（）には2つのバージョンがあることに注意してください。

単純な.load（）呼び出し（URLの後にセレクターがない）は、dataType： "html"を指定して$ .ajax（）を呼び出し、返されたコンテンツを取得して.html（）を呼び出してそれらのコンテンツをDOMに配置するための省略形です。。また、dataType： "html"のドキュメントには、「含まれているスクリプトタグはDOMに挿入されたときに評価される」と明記されています。http://api.jquery.com/jquery.ajax/ したがって、.load（）は公式にインラインスクリプトを実行します。

複雑な.load（）呼び出しには、load（ "page.html #content"）などのセレクターがあります。このように使用すると、jQueryは、次のような記事で説明されているように、スクリプトタグを意図的に除外します。https：//forum.jquery.com/topic/the-load-function-and-script-blocks#14737000000752785 この場合、スクリプトは決して一度も実行しません。

Question 11

Firefoxでのみ発生するように思われる同じ問題が発生し、既存のPHPファイルのフロントエンドを変更していたため、.load（）以外の別のJQueryコマンドを使用できませんでした...

とにかく、.load（）コマンドを使用した後、ロードされた外部HTML内にJQueryスクリプトを埋め込みましたが、機能しているように見えました。メインドキュメントの上部にロードしたJSが新しいコンテンツで機能しなかった理由がわかりません...

Question 12

に変更することで、この問題を修正できまし$(document).ready()たwindow.onLoad()。

Question 13

@efreedの回答に取り組む...

.load('mypage.html #theSelectorIwanted')セレクターでページからコンテンツを呼び出すために使用していましたが、それは内部のインラインスクリプトを実行しないことを意味します。

代わりに、マークアップを変更して'#theSelectorIwanted'独自のファイルにすることができ、使用しました

load('theSelectorIwanted.html`, function() {});

インラインスクリプトは問題なく実行されました。

誰もがそのオプションを持っているわけではありませんが、これは私が望む場所に到達するための迅速な回避策でした！