在公司项目过程中开发过几个插件betway体育app

深谙jquery的家伙大致花个5到10分钟就足以消除了呢。由于这种导 航效果比较通用,LEVIN顺手写了个 jquery插件~ 假如您的网站也要求临近的作用,大可拿去向来用只怕扩充下:) 假如你也想尝试将有些可接受效率封 装成jquery插件,别忘了看看通常的jquery插件开拓进度,别的还可能有偶的二个jquery插件模板。 复制代码 代码如下: ; { // Private functions. var p = {}; p.showC = function { ///show content of a specified navigation p._clist.hide.show(); }; //showNav p.onNav = function; p._alist.removeClass; p._i.addClass; p.showC({ filter:p._i.attr; return false; }; //onClick //main plugin body $.fn.imgNav = function { // Set the options. options = $.extend({}, $.fn.imgNav.defaults, options); p._opts = options; // Go through the matched elements and return the jQuery object. return this.each { p._alist = $; p._clist = $; p._alist.click; }; // Public defaults. $.fn.imgNav.defaults = { on: 'on', off: 'off', navc: '.navc'//nav content selector }; });

在公司项目经过中开支过多少个插件,上边为Levin所用的JQuery插件模板。和google上的一模二样哈。

jQuery 插件开拓指南,jquery开荒指南

那正是说首先我们来总结的看一下最职业的 jQuery 插件定义情势:

复制代码 代码如下:

(function ($) {    
$.fn.插件名 = function (settings) {        
//暗中同意参数        
var defaultSettings = {
 
        }         /* 合并暗中同意参数和客户自定义参数 */       
 
settings = $.extend(defaultSettings, settings);
 
return this.each(function () {             //代码         });   //插件在要素内多次产出
 
} })(jQuery);

 
先来看模板中的第大器晚成行代码(当然大家要把这风度翩翩行代码的后半片段给揪出来一同看,不然第风流倜傥行就完全无意义了卡塔 尔(阿拉伯语:قطر‎:

复制代码 代码如下:

(function ($) {
 
})(jQuery);

 那行代码其实是用于创建多少个无名氏函数。假诺你对佚名函数和闭包不领会,将会对这种代码特别纳闷,那么刚烈建议您读书【详谈JavaScript 无名函数及闭包】这篇小说。

jQuery 的继承方法 $.extend —— $.extend 在jQuery 插件开采中有个很要紧的功用,正是用来合并参数。

复制代码 代码如下:

$.fn.tip = function (settings) {    
var defaultSettings = {           
//颜色    
color: 'yellow',       
//延迟       
timeout: 200     }
 /* 合并暗中认可参数和客户自定义参数 */  
settings = $.extend(defaultSettings, settings);   
alert(settings.input); <br>}

 jQuery 插件定义第三种艺术:

复制代码 代码如下:

(function ($) {
    //插件定义--更改名字
    $.fn.tabpanel = function (method) {
        var methods = $.fn.tabpanel.methods;
        if (methods[method]) {
            return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (typeof method === 'object' || !method) {
            return methods.init.apply(this, arguments);
        } else {
 
        }
    }
    //协助的措施
    $.fn.tabpanel.methods =
    {
        //初始化
        init: function (p_options) {
            tabpanelBind(p_options, this);
        },
        add: function (p_options) {
            addTab(p_options, this);
            tabpanelBind(p_options, this);
            // debugger
        }    }
    function add(p_options) {
        var _defaults = {
            id: ""
        }
    <br>    //内部得以完结略.........<br>        return _index;
    }
<br>})(jQuery);<br><br>调用  $("#team").tabpanel('add',"");

好了,上边介绍的这2种开拓格局都以最常用的,小同伴们先好学不倦下啊,后续我们再介绍的更浓厚些

插件开拓指南,jquery开拓指南 那么首先大家来大约的看一下最专门的工作的 jQuery 插件定义情势: 复制代码 代码如下: (function ($) { $.fn.插件...

复制代码 代码如下:

本文由必威发布于必威-前端,转载请注明出处:在公司项目过程中开发过几个插件betway体育app

TAG标签:
Ctrl+D 将本页面保存为书签,全面了解最新资讯,方便快捷。