jquery自定義插件結合baiduTemplate.js實現非同步刷新（附源碼）

上一篇記錄了BaiduTemplate模板引擎使用示例附源碼，在此基礎上對使用方法進行了封裝

自定義插件jajaxrefresh.js 代碼如下：

//閉包限定命名空間
(function ($) {
    $.fn.extend({
        "ajaxrefresh": function (options) {
            //檢測用戶傳進來的參數是否合法
            if (!isValid(options))
                return this;
            var opts = $.extend({}, defaluts, options); //使用jQuery.extend 覆蓋插件預設參數
            var $this = $(this); //獲取當前dom 的 jQuery對象
            $.ajax({
                url: opts.url,
                dataType: "json",
                success: function (data) {
                    var template = opts.template;
                    $.ajax({
                        url: template,
                        dataType: "html",
                        success: function (val) {
                            $this.html(baidu.template(val, data));
                        }
                    });
                }
            });

        }
    });
    //預設參數
    var defaluts = {
        template: '',
        url:''
    };
    //私有方法，檢測參數是否合法
    function isValid(options) {
        return !options || (options && typeof options === "object") ? true : false;
    }
})(window.jQuery);

調用方法：

$(document).ready(function () {
            $("#list").ajaxrefresh({ template: 'templates/list.html', url: 'data/data.txt' });
        });

預覽效果：

源碼下載