Jquery 插件 实例
先说明下应用场景,通过可配项的配置和默认项覆盖,获取指定的需求数据,填充到指定的位置(两个指定其实都是可配的)
(function($) {
$.fn.extend({
getOneNews: function(opt) { //获取单条新闻信息
var defaults = {
newsId: "",
};
var options = $.extend(defaults, opt);
var _this = this;
_this.html("<p style='text-align:center'>信息获取中,请稍后...</p>")
$.ajax({
dataType:"jsonp",
jsonp: "callback",
url:"xxxx/news/GetNewsById?newsid="+options.newsId,
success:function(res){
_this.html(res.obj.news_content)
},
error: function(){
_this.html("<p style='text-align:center'>数据异常,请稍后再试!</p>")
}
});
}
})
})(jQuery)
采用闭包的方式,执行插件方法;
调取方式:
$(指定容器).getOneNews({
newsId: 配置参数
})
就这么简单!如果有多个插件,直接通过对象的方式写,使用方式一样同上。
Jquery 插件 实例的更多相关文章
- jQuery插件实例五:手风琴效果[动画效果可配置版]
昨天写了个jQuery插件实例四:手风琴效果[无动画版]那个是没有动画效果的,且可配置性不高,本篇为有动画效果.对于一些数据做了动态的计算,以实现自适应. 欢迎大家入群相互交流,学习,新群初建,欢迎各 ...
- jQuery插件实例一:年华时代插件Alert对话框
在工作中使用jQuery插件相信对于程序员来说非常普遍,在网络上也有很多优秀的插件可供大家使用,功能非常强大.在之前用过的一些插件中,有些太过追求功能的强大和可配置性,造成使用的复杂度上升.个人认为与 ...
- 一个很简单的jQuery插件实例教程(菜鸟级)
很多公司的前端设计开发人员都是女孩子,而这些女孩子很多JavaScript技能都不是很好.而前端开发过程中,JavaScript技能又是必不可少的.所以,如果前端小MM正在为某个JavaScript效 ...
- jQuery插件实例七:一棵Tree的生成史
在需要表示级联.层级的关系中,Tree作为最直观的表达方式常出现在组织架构.权限选择等层级关系中.典型的表现形试类似于: 一颗树的生成常常包括三个部分:1)数据库设计:2)后台程序:3)前端代码.那么 ...
- jQuery插件实例四:手风琴效果[无动画版]
手风琴效果就是内容的折叠与打开,在这个插件中,使用了三种数据来源:1.直接写在DOM结构中:2.将数据写在配置项中:3.从Ajax()中获取数据.在这一版中,各项的切换没有添加动画效果,在下一版中会是 ...
- jQuery插件实例三:图片滚动[切换]效果一
图片切换效果在很多网站上都能看到,是一种常见的广告/活动宣传方式,通常位于网页上端.这个插件是众多图片切换效果的形式中的一种,数据源可在前端配置,也可从后台通JSON格式传输数据,当然,数据格式是固定 ...
- jQuery插件实例二:年华时代插件ReturnTop回到首页
这个插件功能在于当网页内容高度很高时,方便用户快速回到顶部.核心在于对屏幕高度的获取,定时器的使用,在引用代码后,只使用$.nhsd.returnTop();即可实现效果 效果图: 代码: ; fun ...
- jQuery插件实例六:jQuery 前端分页
先来看看效果: 对于前端分页,关键是思路,和分页算法.本想多说两句,可又觉得没什么可说的,看代码吧: 如何使用? $("#pging").zPagination({ 'navEve ...
- 简单的 jQuery 浮动层随窗口滚动滑动插件实例
写了一个非常简单的 jQuery 插件实例 浮动层随窗口滚动滑动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...
随机推荐
- [luoguP2774] 方格取数问题(最大点权独立集)
传送门 引入两个概念: 最小点权覆盖集:满足每一条边的两个端点至少选一个的最小权点集. 最大点权独立集:满足每一条边的两个端点最多选一个的最大权点集. 现在对网格染色,使得相邻两点颜色不同,之后把两个 ...
- LibreOJ2045 - 「CQOI2016」密钥破解
Portal Description 给出三个正整数\(e,N,c(\leq2^{62})\).已知\(N\)能表示成\(p\cdot q\)的形式,其中\(p,q\)为质数.计算\(r=(p-1)( ...
- 刷题总结——Tree chain problem(HDU 5293 树形dp+dfs序+树状数组)
题目: Problem Description Coco has a tree, whose vertices are conveniently labeled by 1,2,…,n.There ar ...
- Java-河内塔问题
河内之塔(Towers of Hanoi)是法国人M.Claus(Lucas)于1883年从泰国带至法国的,河内为越战时北越的首都,即现在的胡志明市:1883年法国数学家 Edouard Lucas曾 ...
- vue-cli脚手架每行注释--摘抄
.babelrc文件 { // 此项指明,转码的规则 "presets": [ // env项是借助插件babel-preset-env,下面这个配置说的是babel对es6,es ...
- est6 -- Object.is()、Object.assign()、Object.defineProperty()、Symbol、Proxy
Object.is()用来比较两个值是否严格相等.它与严格比较运算符(===)的行为基本一致,不同之处只有两个:一是+0不等于-0,二是NaN等于自身. + === - //true NaN === ...
- jq 全选、反选、判断选中的条数
1.全选或全不选.当勾选全选按钮#selectAll旁边的复选框#all时,列表中的选项全部选中,反之取消勾选则列表中的选项全部为未选中状态. $("#all").click(fu ...
- 微信小程序踩坑之一[wx.request]请求模式
最近在做小程序时,使用wx.request()方法请求时, 当使传输string类型时,一定要声明method请求模式为post,否则会一直报错,而不声明时默认为get, 已填坑 =,= wx.req ...
- 关于udo3d双目相机的嵌入式板子系统重装
遇到的问题: 1.下载压缩文件(.rar):在linux下下载一会就会停止 原因:linux下不支持.rar文件的下载,在windows下载即可 2.在windows下解压文件,结果为镜像文件(.im ...
- Nginx日志参数、location匹配规则、设置密码
1.三个参数 a)$http_referer:记录此次请求是从哪个链接访问过来的: 是直接访问,还是从其他网站跳转过来的. 例如:访问:http://www.etiantian.com/,其页面首页是 ...