自定义 jquery 插件：'plugin'不是一个函数

Question

当我以这种方式绑定自定义插件时，它工作正常：

<script type="text/javascript">
    $("#MyGrid").customFilter({ postUrl: '@(Url.Action("SearchOffers", "Department"))' });
</script>

但如果我想等到文档准备好：

<script type="text/javascript">
    $(document).ready(function() {
        $("#MyGrid").customFilter({ postUrl: '@(Url.Action("SearchOffers", "Department"))' });
    });
</script>

$("#MyGrid").customFilter is not a function 错误出现。为什么？

自定义插件：

(function ($) {

    var theGrid;
    var filterTimeout;
    var mouseIsInside = false;
    var postUrl;

    var methods = {
        init: function (options) {

            return this.each(function () {
                postUrl = options.postUrl;
                theGrid = $(this);
                ...
            });
         },
    method2: function () {
        // ... 
    }
};

    $.fn.customFilter = function (method) {

        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
            $.error('Method ' + method + ' does not exist on  jQuery.customFilter ');
        }

    };

    //private functions
    function isFilterable(th) {
        var name = th.children("a").text();
        return (name.length > 0) ? true : false;
    }
...
})(jQuery);

Answer 1

脚本文件应在 Telerik().ScriptRegistrar() 中注册

@Html.Telerik().ScriptRegistrar().DefaultGroup(group => group.Add("~/Scripts/gridFilter.js"))