先说明下应用场景,通过可配项的配置和默认项覆盖,获取指定的需求数据,填充到指定的位置(两个指定其实都是可配的)

(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 插件 实例的更多相关文章

  1. jQuery插件实例五:手风琴效果[动画效果可配置版]

    昨天写了个jQuery插件实例四:手风琴效果[无动画版]那个是没有动画效果的,且可配置性不高,本篇为有动画效果.对于一些数据做了动态的计算,以实现自适应. 欢迎大家入群相互交流,学习,新群初建,欢迎各 ...

  2. jQuery插件实例一:年华时代插件Alert对话框

    在工作中使用jQuery插件相信对于程序员来说非常普遍,在网络上也有很多优秀的插件可供大家使用,功能非常强大.在之前用过的一些插件中,有些太过追求功能的强大和可配置性,造成使用的复杂度上升.个人认为与 ...

  3. 一个很简单的jQuery插件实例教程(菜鸟级)

    很多公司的前端设计开发人员都是女孩子,而这些女孩子很多JavaScript技能都不是很好.而前端开发过程中,JavaScript技能又是必不可少的.所以,如果前端小MM正在为某个JavaScript效 ...

  4. jQuery插件实例七:一棵Tree的生成史

    在需要表示级联.层级的关系中,Tree作为最直观的表达方式常出现在组织架构.权限选择等层级关系中.典型的表现形试类似于: 一颗树的生成常常包括三个部分:1)数据库设计:2)后台程序:3)前端代码.那么 ...

  5. jQuery插件实例四:手风琴效果[无动画版]

    手风琴效果就是内容的折叠与打开,在这个插件中,使用了三种数据来源:1.直接写在DOM结构中:2.将数据写在配置项中:3.从Ajax()中获取数据.在这一版中,各项的切换没有添加动画效果,在下一版中会是 ...

  6. jQuery插件实例三:图片滚动[切换]效果一

    图片切换效果在很多网站上都能看到,是一种常见的广告/活动宣传方式,通常位于网页上端.这个插件是众多图片切换效果的形式中的一种,数据源可在前端配置,也可从后台通JSON格式传输数据,当然,数据格式是固定 ...

  7. jQuery插件实例二:年华时代插件ReturnTop回到首页

    这个插件功能在于当网页内容高度很高时,方便用户快速回到顶部.核心在于对屏幕高度的获取,定时器的使用,在引用代码后,只使用$.nhsd.returnTop();即可实现效果 效果图: 代码: ; fun ...

  8. jQuery插件实例六:jQuery 前端分页

    先来看看效果: 对于前端分页,关键是思路,和分页算法.本想多说两句,可又觉得没什么可说的,看代码吧: 如何使用? $("#pging").zPagination({ 'navEve ...

  9. 简单的 jQuery 浮动层随窗口滚动滑动插件实例

    写了一个非常简单的 jQuery 插件实例  浮动层随窗口滚动滑动 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...

随机推荐

  1. 【bzoj3261】最大异或和 可持久化Trie树

    题目描述 给定一个非负整数序列 {a},初始长度为 N.       有M个操作,有以下两种操作类型:1.A x:添加操作,表示在序列末尾添加一个数 x,序列的长度 N+1.2.Q l r x:询问操 ...

  2. [luoguP2766] 最长递增子序列问题(最大流)

    传送门 题解来自网络流24题: [问题分析] 第一问时LIS,动态规划求解,第二问和第三问用网络最大流解决. [建模方法] 首先动态规划求出F[i],表示以第i位为开头的最长上升序列的长度,求出最长上 ...

  3. LibreOJ2044 - 「CQOI2016」手机号码

    Portal Description 给出两个十一位数\(L,R\),求\([L,R]\)内所有满足以下两个条件的数的个数. 出现至少\(3\)个相邻的相同数字: 不能同时出现\(4\)和\(8\). ...

  4. 【前端学习笔记】2015-09-01 附 split()方法、readyState

    1.split():作用对象是一个字符串或者字符串对象,会要求设置两个参数(分割点(separator),分割出来的数量(number)),ps:1."2:3:4:5".split ...

  5. What is pseudopolynomial time? How does it differ from polynomial time?

    To understand the difference between polynomial time and pseudopolynomial time, we need to start off ...

  6. hdu 5455(字符串处理)

    Fang Fang Time Limit: 1500/1000 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Others)Total S ...

  7. LeetCode OJ-- Simplify Path **

    https://oj.leetcode.com/problems/simplify-path/ 对linux路径的规范化,属于字符串处理的题目.细节很多. #include <iostream& ...

  8. LeetCode OJ——Subsets

    http://oj.leetcode.com/problems/subsets/ 计算一个集合的子集,使用vector<vector<int> >,使用了进制的思想. #inc ...

  9. Codeforces Gym101502 H.Eyad and Math-换底公式

    H. Eyad and Math   time limit per test 2.0 s memory limit per test 256 MB input standard input outpu ...

  10. HDU 5726 GCD(ST&RMQ)

    题目链接 GCD 先ST倍增预处理,f[i][j]表示从i开始(包含第i个数)的连续2^j个数的最大公约数. 这样就可以在O(1)内询问得到a[l]到a[r]之间的所有数的最大公约数的值. 然后对于每 ...