私の JavaScript 関数が JSFiddle で定義されていないのはなぜですか?

JSFiddle で JavaScript が実行されない理由: 関数定義エラーの解決

JSFiddle で JavaScript コードを実行しようとすると、エラーが発生する場合があります特定の関数が定義されていないことを示します。これは、JSFiddle が onload 関数内にコードをカプセル化し、関数定義の範囲を制限するために発生します。

関数の定義と参照

提供されたコードでは、fillList( などの関数) ) と mySelectList() は window.onload 関数内で定義されます。これは、これらの関数にはこの関数内からのみアクセスできることを意味します。ただし、これらを HTML でグローバル変数として参照しようとしているため、エラーが発生します。

解決オプション

これを解決するには、次の 3 つのオプションがあります。

a) グローバル変数として関数を変更する

• 最も単純かつ迅速な、ただし理想的ではない解決策は、関数定義構文を次のように変更することです。

<code class="javascript">window.fillList = function() {}; // makes fillList a global function</code>

b) 控えめな JavaScript

• 推奨されるアプローチは、HTML を JavaScript から分離する控えめな JavaScript を利用することです。

<code class="javascript">// attach event listener from within JavaScript
var mySelectList = document.getElementById('mySelectList');
mySelectList.addEventListener('change', function() {
    alert('Selection changed!');
});</code>

c) JSFiddle 設定の変更

• JSFiddle では、ラッピング オプションを指定できます。 onload 関数内にコードが含まれないようにするには、カプセル化設定を「ラップなし - ヘッドまたはボディ」に変更します。

推奨事項

オプション b) を強くお勧めします。ベスト プラクティスとコードの編成を促進するためです。 HTML を JavaScript から分離することで、コードの制御性と柔軟性が向上します。

以上が私の JavaScript 関数が JSFiddle で定義されていないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。