在點擊事件處理程序中調用自定義jQuery插件會生成錯誤

Question

在這個問題上，我一直在絞盡腦汁。 我已經編寫了一些自定義插件，而我以前從未遇到過。

這是我的情況。 我寫了一個簡單的插件。 然后在點擊事件處理程序中，我想調用我的插件。 當我這樣做時，我得到一個錯誤，提示“對象不支持屬性或方法'插件名稱'”。

為了解決此問題，我刪除了除jQuery和jQuery UI以及我的自定義插件以外的所有其他腳本。 那仍然沒有解決問題。 因此，我想也許我有一會兒從jQuery頁面“ greenify”復制了示例插件，並對此進行了測試。 結果還是一樣。 以下是我要執行的操作的示例。

注意：奇怪的問題是，當我在“ click”事件處理程序之外調用插件時，它工作正常。

插入：

(function ($){
    $.fn.greenify = function(options){
        // This is the easiest way to have default options.
        var settings = $.extend({
            // These are the defaults.
            color: "#556b2f",
            backgroundColor: "black"
        }, options );
       // Greenify the collection based on the settings variable.
       return this.css({
        color: settings.color,
        backgroundColor: settings.backgroundColor
    });
};
}( jQuery ));

然后是在事件外部調用插件1）在事件內部調用插件的兩個示例：

<script type="text/javascript" src="mypluginloaction.js"></script>
<script type="text/javascript">
  $(function(){

    //This works!
$('a').greenify();


$('.post-box-left').on('click', function(){
            //This does not work
    $('a').greenify();
    $('#blurBackground').show();
    $('#popupWindow').show();
});
</script>

真正令人討厭的是，當我用jsFiddle插件運行時。 我正在尋找有關為什么會發生這種情況的建議。 我會嘗試的。 謝謝！

---

更新：

絞盡腦汁后，我發現了問題所在，但不確定100％如何解決。

在另一個$（function（）{}）中； 我調用$（）。load（）來加載ajax頁面。 如果我刪除它，那么一切都會很好。

$(function(){
    /* Removing this makes it work!
        $('#Poll').load('AJAX/Poll.asp');
    */
});

知道為什么嗎？

Answer 1

我找到了根本原因。 我正在通過ajax（由其他人編寫）進入一個頁面，該頁面調用了另一個jQuery實例。 由於此調用是在我包含插件之后且在調用我的代碼之前，因此它覆蓋了jQuery實例。 我猜這是為什么它在文檔准備期間運行但不在jQuery集合內運行的原因。