Javascriptスコープの問題：$（doc）.ready（）では利用可能ですが、イベントハンドラでは使用できない関数

3rd party scriptを使用して、ページ上の画像にズーム機能を追加しています。静的にはうまく機能しますが、動的コンテンツではうまく機能しません。

静的バージョンは、作品：

$(document).ready(function(){ 
    $('#gallery_main_img').addpowerzoom(); 
})

ダイナミックバージョンは、動作しません：

$(document).ready(function(){ 
    $('#gallery_main_img').load(OnGalleryImageChanged); 
}) 

function OnGalleryImageChanged() { 
    $('#gallery_main_img').addpowerzoom(); 
}

addpowerzoom機能がPowerZoomスクリプトでこのコードを使用して作成され、私のページの<head>で参照されています：

イベントハンドラを入力するとき

$.fn.addpowerzoom=function(options){ 
    // function content here 
}

、Firebugのは、私にこのエラーメッセージを表示します。
$("#gallery_main_img").addpowerzoom is not a function.

だから、スコープの問題のようです。私の質問は：

私のイベントハンドラの中からaddpowerzoom（）関数にアクセスするにはどうすればいいですか？あなたは3rd party script's sourceは、まず最初に、あなたはそれがコードjQuery.noConflict()と、noConflict modeにjQueryのに設定されてやる気付くでしょうことを確認し、それが$を意味し、いずれかの変数に代入していない場合

出典

2011-12-29 Treb

のために予約されていませんもうjQuery。

最初のケースが機能していると述べたので、私はサードパーティのスクリプトを組み込む前に準備ができていると仮定しています。

あなたは（jQueryと$を置き換える）、このようにコードを変更することができ、次のいずれか

jQuery(document).ready(function(){ 
    jQuery('#gallery_main_img').load(OnGalleryImageChanged); 
}) 

function OnGalleryImageChanged() { 
    jQuery('#gallery_main_img').addpowerzoom(); 
}

例：http://jsfiddle.net/niklasvh/8Vjnu/

かの内のコードをラップ：

(function($) { 
    $(function() { 
    // more code using $ as alias to jQuery 
    }); 
})(jQuery);

または多分第三者のスクリプトからnoConflictを完全に削除します（著者が決してpuしてはならないものスクリプトを使用するすべての人が$からjQueryを削除したいと仮定しない限り、最初はそこにはありません。

出典

2011-12-29 10:26:46 Niklas

ありがとうございました！私は 'noConflict'呼び出しを投げ捨てることになりました。これは、スクリプトをもう一度実行するためにはいくつかの手間を要しましたが、今は期待どおりに動作します。 – Treb

@トレブはい、それはあなたが他の場所でも通常どおりjQueryを使いたいと仮定して、最良の解決策になります。あなたはそれが働いてうれしい:) – Niklas

Javascriptスコープの問題：$（doc）.ready（）では利用可能ですが、イベントハンドラでは使用できない関数

答えて

関連する問題