Jquery Plugin模版

1. [代码][JavaScript]代码

01// remember to change every instance of "pluginName" to the name of your plugin!
02// the semicolon at the beginning is there on purpose in order to protect the integrity
03// of your scripts when mixed with incomplete objects, arrays, etc.
04;(function($) {
05 
06    // we need attach the plugin to jQuery‘s namespace or otherwise it would not be
07    // available outside this function‘s scope
08    // "el" should be a jQuery object or a collection of jQuery objects as returned by
09    // jQuery‘s selector engine
10    $.pluginName = function(el, options) {
11 
12        // plugin‘s default options
13        // this is private property and is accessible only from inside the plugin
14        var defaults = {
15 
16            propertyName: ‘value‘,
17 
18            // if your plugin is event-driven, you may provide callback capabilities
19            // for its events. call these functions before or after events of your
20            // plugin, so that users may "hook" custom functions to those particular
21            // events without altering the plugin‘s code
22            onSomeEvent: function() {}
23 
24        }
25 
26        // to avoid confusions, use "plugin" to reference the
27        // current instance of the  object
28        var plugin = this;
29 
30        // this will hold the merged default, and user-provided options
31       // plugin‘s properties will be accessible like:
32        // plugin.settings.propertyName from inside the plugin or
33        // myplugin.settings.propertyName from outside the plugin
34        // where "myplugin" is an instance of the plugin
35        plugin.settings = {}
36
37        // the "constructor" method that gets called when the object is created
38        // this is a private method, it can be called only from inside the plugin
39        var init = function() {http://www.huiyi8.com/moban/
40 
41            // the plugin‘s final properties are the merged default and
42            // user-provided options (if any)网站源码
43            plugin.settings = $.extend({}, defaults, options);
44 
45            // make the collection of target elements available throughout the plugin
46            // by making it a public property
47           plugin.el = el;
48 
49            // code goes here
50 
51        }
52 
53        // public methods
54        // these methods can be called like:
55        // plugin.methodName(arg1, arg2, ... argn) from inside the plugin or
56        // myplugin.publicMethod(arg1, arg2, ... argn) from outside the plugin
57        // where "myplugin" is an instance of the plugin
58 
59       // a public method. for demonstration purposes only - remove it!
60        plugin.foo_public_method = function() {
61 
62            // code goes here
63 
64        }
65 
66        // private methods
67        // these methods can be called only from inside the plugin like:
68        // methodName(arg1, arg2, ... argn)
69 
70        // a private method. for demonstration purposes only - remove it!
71        var foo_private_method = function() {
72 
73            // code goes here
74 
75        }
76 
77        // call the "constructor" method
78        init();
79 
80    }
81 
82})(jQuery);

Jquery Plugin模版,布布扣,bubuko.com

时间: 2024-08-03 11:21:10

Jquery Plugin模版的相关文章

jQuery ui widget和jQuery plugin的实现原理简单比较

一.创建 1.  jQuery plugin (function($){ $.fn.MyPlugin=function(){ //js代码 } })(jQuery) 为了与页面上其他代码友好相处,将plugin定义在一个闭包里,MyPlugin是plugin的名字.调用方式:$('选择器').MyPlugin(); 2.  jquery ui widget (function($){ $.widget('ui.mywidget',{ options:{ //默认的配置参数 }, //方法的定义

The ultimate jQuery Plugin List(终极jQuery插件列表)

下面的文章可能出自一位奥地利的作者,  列出很多jQuery的插件.类似的网站:http://jquerylist.com/原文地址: http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/ jQuery is definitely my favourite Javascript Library and this ultimate jQuery Plugin List is for all oth

Native Fullscreen JavaScript API (plus jQuery plugin)

http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/ HTML5 <video> is great, but when it was first released, one of the big complaints was that it couldn’t do true FullScreen like Flash. Thankfully, this is changing and native F

[jQuery] 自做 jQuery Plugin - Part 1

有時候寫 jQuery 時,常會發現一些簡單的效果可以重複利用.只是每次用 Copy & Paste 大法似乎不是件好事,有沒有什麼方法可以讓我們把這些效果用到其他地方呢? 沒錯,就是用 jQuery 的 Plugin 機制. 不過 jQuery 的 Plugin 機制好像很難懂?其實一點也不.以下我用最簡單的方式來為大家解說如何自製一個簡單的 Plugin . 當然在此之前,你得先瞭解 JavaScript 的 class . object . variables scope 還有 anony

Eclipse jQuery plug-in(自动补全)

1,Eclipse 安装 spket 插件.( 两种方式):  在线安装:Help->Install New Software...->Add...->Name: "Spket", Location: http://www.spket.com/update/   下载完毕重启 Eclipse .  手动安装:到http://www.spket.com/download.html  下载 Plugin 版本,当前版本为1.6.17.下载解压后直接放置于Eclipse 的

一个不错的jquery插件模版

pageplugin.js (function ($) { $.PagePlugin = function (obj, opt) { var options = $.extend({}, $.PagePlugin.defaults), docOffset, _ua = navigator.userAgent.toLowerCase(), is_msie = /msie/.test(_ua), ie6mode = /msie [1-6]\./.test(_ua); if (typeof (obj)

jQuery plugin items filter

最近在Github上找到一款不错的过滤/筛选插件,类似jQuery UI的slider组件,不多说,上例子. jQuery UI app.js function showProducts(minPrice, maxPrice) { $("#products li").hide().filter(function() { var price = parseInt($(this).data("price"), 10); return price >= minPri

JQuery Plugin 开发

jquery 中有2个重要的API是和插件编写相关的. jQuery.extend(object)    即 $.extend(object) 这个函数是用来扩展 jQuery 本身, 也就是扩展 "$" 的. jQuery.fn.extend(object) 即 $.fn.extend(object) 这个函数用来为 jQuery 对象提供新的方法. 所谓 jQuery 对象, 最常见的我们平时通过jQuery选择器获取的对象, 比如: $("#id"), $(&

jQuery - plugin 代码模型

1.扩展 jQuery 的全局函数,主要以 $.xxx() 的形式调用 (function($) { $.myFunction = function(array) { // code } })(jQuery); 在外部可以这样调用 $.myFunction(...),但是,最好把自定义的全局函数放在自己的命名空间中,如下, (function($) { $.myNameSpace = { sum: function(array) { // code }, average: function(ar