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 
}

當進入事件處理程序，螢火蟲給我此錯誤消息：
$("#gallery_main_img").addpowerzoom is not a function.

所以這似乎是一個範圍問題。我的問題是：

如何從我的事件處理程序中訪問addpowerzoom（）函數？

來源

2011-12-29 Treb

如果檢查3rd party script's source，第一件事情，你會發現它做的是設置在jQuery的noConflict mode，與代碼jQuery.noConflict()，並沒有把它分配給一個變量要麼，這意味着$不保留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 2011-12-29 14:37:04

@Treb是的，這將是最好的解決方案，假設你希望在別處正常使用jQuery。真高興你做到了：） – Niklas 2011-12-29 14:49:07

JavaScript範圍問題：函數在$（doc）.ready（）中可用，但在事件處理程序中不可用

回答

相關問題