首页 > 这个改成jquery的对象下的方法怎么改

这个改成jquery的对象下的方法怎么改

下面的原生js插件换成jquery$.fn.extend的插件怎么改,没用过jquery的插件开发

var oSwitch = function(el, options) {
            this.dom = null;
            this.header = null;
            this.footer = null;
            return new oSwitch.prototype.init(el, options);
        };
        oSwitch.prototype = {
            constructor: oSwitch,
            init: function(el, options) {
                this.dom = (typeof el === "string") ? document.querySelector(el) : el;
                this.settings = {
                    bottomNav: [{
                        title: "", //标题
                        img: "", //图片
                        imgCurrent: "", //当前图片
                        classHash: "" //class和hash值(一样)
                    }], //底部栏目内容
                    NavbgW: "10px", //图片宽
                    NavbgH: "10px", //图片高
                    NavTop: "3px", //距离上边距
                    bottomHeight: "35px", //底部栏高度
                    currentColor: "red" //当前文字颜色
                };
                for (var i in options) {
                    this.settings[i] = options[i];
                };
                this.isBottom(this.settings.bottomNav);
            },
            isBottom: function(num) {
                var _this = this,
                    arr = [],
                    adom = [];
                if (num.length === 0) {
                    return false;
                }
                this.footer = document.createElement("footer");
                this.footer.className = "oFooter";
                this.footer.style.height = this.settings.bottomHeight;
                this.dom.appendChild(this.footer);
                for (var key in num) {
                    if (!num.hasOwnProperty(key) || ("title" in num[key] && num[key]["title"] !== "")) {
                        arr.push(num[key]["classHash"]);
                        var nav = document.createElement("nav");
                        nav.style.position = "relative";
                        nav.innerHTML = num[key]["title"];
                        if (!num[key]["classHash"]) {
                            nav.setAttribute("data-hash", "");
                        } else {
                            nav.setAttribute("data-hash", num[key]["classHash"]);
                        }
                        nav.setAttribute("index", key);
                        this.footer.appendChild(nav);
                        adom.push(nav);
                        var oImg = document.createElement("img");
                        oImg.style.width = this.settings.NavbgW;
                        oImg.style.height = this.settings.NavbgH;
                        oImg.style.position = "absolute";
                        oImg.style.left = Math.ceil((this.footer.clientWidth / num.length - parseInt(oImg.style.width)) / 2) + "px";
                        oImg.style.top = this.settings.NavTop;
                        nav.appendChild(oImg);
                    }
                }
            }
        };
        oSwitch.prototype.init.prototype = oSwitch.prototype;

jQuery.fn.switch = function(options){
    oSwitch($(this)[0], options);
    //this就是你jquery选择器查到的元素,是网页元素还是jquery对象我忘记了,用$(this)[0]稳妥点,你可以输出下看看。
}

没测试,按jquery插件的写法,写了一段。在原来的基础上补这样一段就可以了,这样改比较快。用的时候这样用:
$('#your_switch_element').switch(options);

【热门文章】
【热门文章】