jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)

时间:2021-05-26

上一篇记录了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' }); });

预览效果:

源码下载:http://xiazai.jb51.net/201612/yuanma/baiduTemplate-v1.1_jb51.rar

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章