1

1.htmlと2.htmlの 2 つの HTML ファイルがあります。

  • 1はメインページで、 2を ajaxでロードし、そのコンテンツを に詰め込みますdiv。
  • 1には、 A、B、およびCの3 つのスクリプト ブロックがあります。
    • $(document).ready()ブロックBのは、ブロックCの関数を呼び出します。
    • エラーはありません。
  • 2には、 P、Q、およびRの 3つのスクリプト ブロックがあります。
    • $(document).ready()ブロック内のQは、ブロックR内の関数を呼び出します。
    • エラーが発生します。

一部の Javascript が ajax を介して読み込まれると、同じファイル内で後で (前ではなく) 現れるスクリプト ブロック内の関数を呼び出すことができないようです。なんで？これは予想される動作ですか？

ソースコード

1.html

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<!-- Script block A -->
<script type='text/javascript'>
    function A() {alert('A');}
</script>

<div>x</div>

<!-- Script block B -->
<script type='text/javascript'>
    $(function() {
        A(); B(); C();

        $("#ajax_load_result").load("2.html");
    });

    function B() {alert('B');}
</script>

<div>x</div>

<!-- Script block C -->
<script type='text/javascript'>
    function C() {alert('C');}
</script>

<div id='ajax_load_result'>y</div>

2.html

<div>x</div>

<!-- Script block P -->
<script type='text/javascript'>
    function P() {alert('P');}
</script>

<div>x</div>

<!-- Script block Q -->
<script type='text/javascript'>
    $(function() {
        P(); Q(); R();
    });

    function Q() {alert('Q');}
</script>

<div>x</div>

<!-- Script block R -->
<script type='text/javascript'>
    function R() {alert('R');}
</script>

<div>x</div>

出力

、、、、、と警告し、Aエラーメッセージを表示します。BCPQ

エラーメッセージ

オペラ 12.11:

未処理のエラー: 未定義の変数: R

クロム 23.0.1271.97 m:

Uncaught ReferenceError: R が定義されていません

IE9:

SCRIPT5007: プロパティ 'R' の値が null または未定義であり、Function オブジェクトではありません

4

1 に答える 1

2

2.html では $(document).ready がすぐに起動します。これは、dom が既に構築されており、その時点で R を含むスクリプト ブロックにまだ到達していないため、R が定義されていないためです。1.html では、$(document).ready の前にページ全体が読み込まれるため、C が定義されます。

于 2012-12-18T02:07:12.300 に答える