1

2つのスクリプトにリンクするHTMLがあるとします。

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

2つのスクリプトには、それぞれ独自のjQueryが.ready()定義されています。

general.js：

jQuery(function() {
  var foo;
  $('#btn').click(function() {alert(foo())});
}

Specific.js：

jQuery(function() {
  foo = function() {alert("hello")};
  $('#btn').click(function() {foo()});
}

ここ#btnで、はボタン要素です。

クリックする#btnと、「こんにちは」ダイアログが表示されることを期待していましたが、代わりにUncaught TypeError: undefined is not a functionChrome開発ツールを使用しました。

私自身の理解では、イベントfooによってアクセスされる前に、関数が未定義ではなく、すでに割り当てられている必要があります。click明らかに、私の理解は正しくありません。なぜそれがそのように振る舞うのか誰かが私に説明してもらえますか？

4

1 に答える 1

4

最初の関数var 内で「foo」を宣言しています。したがって、それはその関数に対してローカルであり、その外部からは見えません。

「foo」を最初の「ready」ハンドラーの外部で宣言することにより、グローバルにすることができます。

グローバル変数は一種の望ましくありません。値を要素自体の「データ」値として保持する方がよい場合があります。

$(function() {
   $('#btn').data('foo', 'some value');
   $('#btn').click(function() {alert($(this).data('foo'))});
}

このようにして、データは要素に関連付けられ（ただし、DOMオブジェクトに直接ではありません。jQueryは、DOM関連のメモリリークを回避するために内部マップの値を追跡します）、グローバル名前空間を汚染しません。

于 2012-09-28T00:04:13.373 に答える