Jquery 插件开发公开属性顺序的影响.

如下代码拷贝能正常运行.

(function ($) {
    $.fn.DemoPlugin = function (options) {
        var opts;
        opts = $.extend({}, $.fn.DemoPlugin.defaults, options);
        return demoPlugin();

        function demoPlugin() {
            alert("Hello," + opts.msg);
            if (opts.onChanged) {
                opts.onChanged();
            }
        }
    };
    
    $.fn.DemoPlugin.defaults = {
        msg: "World！",
        onChanged: ""
    };
})(jQuery);

web页面调用如下：

<div><h2 onclick="clickMe()">快点击我</h2>
</div>


<script type="text/javascript">
    function clickMe() {
        $.fn.DemoPlugin.defaults.onChanged = function () {
            alert("这里是回调函数.");
        };
        
        $("div").DemoPlugin();
    }
</script>

页面正常运行：

如果把Juqery 代码稍微调整顺序，代码一模一样如下

(function ($) {
    $.fn.DemoPlugin.defaults = {
        msg: "World！",
        onChanged: ""
    };
    
    $.fn.DemoPlugin = function (options) {
        var opts;
        opts = $.extend({}, $.fn.DemoPlugin.defaults, options);
        return demoPlugin();

        function demoPlugin() {
            alert("Hello," + opts.msg);
            if (opts.onChanged) {
                opts.onChanged();
            }
        }
    };
})(jQuery);

变化如下：

错误异常提示如下：

显示jquery插件中函数为定义等。

最后分析为什么没有定义，原来$.fn.DemoPlugin.defaults如果在顺序在前面，$.fn.DemoPlugin此时还没有定义，所以导致$.fn.DemoPlugin.defaults相关属性没有定义.