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' });
});
预览效果:

jquery自定义插件结合baiduTemplate.js实现异步刷新(附源码)的更多相关文章
- arcgis api 3.x for js 共享干货系列之二自定义 Navigation 控件样式风格(附源码下载)
0.内容概览 自定义 Navigation 控件样式风格 源码下载 1.内容讲解 arcgis api 3.x for js 默认的Navigation控件样式风格如下图:这样的风格不能说不好,各有各 ...
- HTML5+CSS3+Jquery实现纯手工的垂直时光轴【附源码】
前言 由于工作中需要,系统中需要记录不同时间发生的事件,为了提升用户体验,决定用时光轴来实现.[据说这个东西挺火的,QQ空间和FB都在用...] 这个时光轴是在 三生石上 这位博主的时光轴基础上修改的 ...
- arcgis api 4.x for js 聚合效果图(附源码下载)
前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 4.x for js:esri 官网 api,里面详细的介绍 arcgis api 4.x 各个类 ...
- 深入学习jQuery自定义插件
原文地址:jQuery自定义插件学习 1.定义插件的方法 对象级别的插件扩展,即为jQuery类的实例增加方法, 调用:$(选择器).函数名(参数); $(‘#id’).myPlugin(o ...
- jquery自定义插件——以 选项卡插件为例
一直打算尝试自定义插件,终于付诸实践了,现在把内容发表出来,与大家共勉. 我是根据自己正在用的插件,模仿其源码,实现的自定义插件,完成之后,在网上看相关资料,对自定义插件部分,有了更明确的认识. jq ...
- jQuery自定义插件
jQuery自定义插件 jQuery自定义插件按照功能分类,可以分为三类, 1>封装对象方法的插件,(也就是基于某个DOM元素的jQuery对象,局部的) 2>封装全局函数的插件, ( ...
- 你的专属定制——JQuery自定义插件
前 言 絮叨絮叨 jQuery是一个快速.简洁的JavaScript框架,是继Prototype之后又一个优秀的JavaScript代码库(或JavaScript框架).jQuery设计的宗 ...
- jQuery自定义插件--banner图滚动
前言 jQuery是一个功能强大的库,提供了开发JavaScript项目所需的所有核心函数.很多时候我们使用jQuery的原因就是因为其使用插件的功能,然而,有时候我们还是需要使用自定义代码来扩展这些 ...
- JQuery自定义插件详解之Banner图滚动插件
前 言 JRedu JQuery是什么相信已经不需要详细介绍了.作为时下最火的JS库之一,JQuery将其"Write Less,Do More!"的口号发挥的极致.而帮助J ...
随机推荐
- Python 日志模块 logging通过配置文件方式使用
vim logger_config.ini[loggers]keys=root,infoLogger,errorlogger [logger_root]level=DEBUGhandlers=info ...
- MFC的定时器OnTimer
本文总结来源出自鸡啄米,感谢鸡啄米.来源:http://www.jizhuomi.com/software/232.html 定时器简介 定时器,可以帮助开发者或者用户定时完成某项任务.在使用定时器时 ...
- CRM/ERP 企业管理软件中常见的七种程序设计模式
管理软件中的常见代码设计模式,来自于业务上的需要,有不恰当的地方欢迎批评指正. 1 RE-TRY 重试模式 场景:在连接数据库服务器时,如果SQL Server数据库没有启动或正在启动,我们需要有一 ...
- c++面试常用知识(sizeof计算类的大小,虚拟继承,重载,隐藏,覆盖)
一. sizeof计算结构体 注:本机机器字长为64位 1.最普通的类和普通的继承 #include<iostream> using namespace std; class Parent ...
- Android中实现双击事件
需求:需要给一个view实现双击效果,查看了api,发现没有api可以调用, 于是从网上参考了一段代码. xml布局文件: <RelativeLayout xmlns:android=" ...
- MySQL常见错误
1. TokuFT file system space is really low and access is restricted 解决方法:修改tokudb_fs_reserve_percent参 ...
- android 之 ListView 里面嵌套 GridView 遇到的问题及其解决方法。
我们直接入主题.所有问题例子请参照下图 1,怎样使图片具有点击事件? 答: 解决方法: 在你的BaseAdapter里面不要设置下面这三个东西,然后再设置GridView的onItemClick. g ...
- TCP ,UDP概念和TCP三次握手连接 的知识点总结
OSI 计算机网络7层模型 TCP/IP四层网络模型 传输层提供应用间的逻辑通信(端到端),网络层提供的是主机到主机的通信,传输层提供的是可靠服务. TCP 中常说的握手指的是:连接的定义和连接的建立 ...
- MongoDB的CRUD操作
1. 前言 在上一篇文章中,我们介绍了MongoDB.现在,我们来看下如何在MongoDB中进行常规的CRUD操作.毕竟,作为一个存储系统,它的基本功能就是对数据进行增删改查操作. MongoDB中的 ...
- CSS3实现图形曲线阴形和翘边阴影
首先,来看看完成之后的效果图: 实现原理 ①曲线阴影实现: 多个阴影重叠,就是正常阴影+曲线阴影 正常情况下,有个矩形有正常的阴影,作为主投影,这时候再定义一个有一定弧度圆角的圆角矩形,然后放在正常矩 ...