http://jsfiddle.net/kyu0hdmx/embedded/#HTML…

转载:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented-manner.html 一.jQuery插件的类型 1. jQuery方法 很大一部分的jQuery插件都是这种类型,由于此类插件是将对象方法封装起来,在jQuery选择器获取jQuery对象过程中进行操作,从而发挥jQuery强大的选择器优势. 2. 全局函数法 可以把自定义的功能函数独立附加到jQ…

一.jQuery插件的类型 1. jQuery方法 很大一部分的jQuery插件都是这种类型,由于此类插件是将对象方法封装起来,在jQuery选择器获取jQuery对象过程中进行操作,从而发挥jQuery强大的选择器优势. 2. 全局函数法 可以把自定义的功能函数独立附加到jQuery命名空间下,从而作为jQuery作用域下的一个公共函数使用.但全局函数没有被绑定到jQuery对象上,故不能在选择器获取的jQuery对象上调用.需要通过jQuery.fn()或$.fn()方式进行引用. 3. 选…

本文转自:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented-manner.html 前言 最近在折腾jQuery插件,写成插件的目的就是为了实现功能与项目相分离,使得这个代码在下一个项目中能直接引用不出错.这使得我们在写插件的时候,就得考虑清楚,怎么写才能使得插件能够通用.灵活度高.可配置.兼容性好.易用性高.耦合度低等. 接下来就对以下几种写法进行分析,…

1.实现内容 定义一个简单的jquery插件,alert传递进来的参数 2.插件js文件(jquery.showplugin.js) (function ($) { //定义插件中的方法 var methods = { //Object showName: function (name) { alert('Name:' + name); }, showAge: function (age) { alert('Age' + age); } }; //method方法名 $.fn.showplugi…

JQuery插件写法 JQuery插件又分为类扩展方法和对象扩展方法两种,类插件是定义在JQuery命令空间的全局函数,直接通过可调用,如可调用,如可调用,如.ajax():对象插件是扩展JQuery对象的函数,通过选择的具体对象调用,类似$(dom).html(). JQuery类扩展方法 直接给$增加方法 $.foo=function(){ console.log('foo'); } $.bar=function(){ console.log('bar'); } 或者给属性增加命名空间 $.…

很多公司的前端设计开发人员都是女孩子,而这些女孩子很多JavaScript技能都不是很好.而前端开发过程中,JavaScript技能又是必不可少的.所以,如果前端小MM正在为某个JavaScript效果发愁的时候,你潇洒的过去,然后对她说:“嗨,美女,用这个吧.这是我写的一个jQuery插件.”我想基本上你的人生大事就能很快解决. 先想好做个什么功能 这是第一步,也是很重要的一步,鉴于咱们都是刚学习写jQuery插件,所以,这个功能一定要简单一些.不要想一口就吃个胖子,咱也吃不了.咱还是捡个瘦的…

前两个是jQuery插件,后面2个是以对象的形式开发,都类似. 写法一 (function($, window){ // 初始态定义 var _oDialogCollections = {}; // 插件定义 $.fn.MNDialog = function (_aoConfig) { // 默认参数,可被重写 var defaults = { // string sId : "", // num nWidth : 400, // bollean bDisplayHeader : tr…

//传统写法 //全局方法 ;(function($){ $.method = function(){ } //or $.obj = { method1:function(){}, method2:function(){} } })(jQuery); //对象方法 ;(function ($){ $.fn.myPlugin = function (options){ var oSetting = $.extend(defaultOptions, options); return this.eac…

1.插件 taskStaticBar.js /**自定义任务进度条插件,用于发布任务单的显示进度 * 先初始化init() * 配置项type:1,任务发布方:type=2,生产方 * 然后传入showByTask(task) * */ (function($) { //设置任务单状态流程进度条,num从1开始 var setTaskStaticBar=function (num) { $(".task_static_wrap").find(".task_static_l&q…