1 //选项卡 2 var Tabs = (function ($) { 3 var options = { 4 selector: undefined,// 5 close: false,//是否可以关闭标签 6 //contextmenu: false,//右键菜单 7 closeCallback: function () { } 8 }; 9 var _newtab; 10 var _tabcontent; 11 var _drop; 12 13 var tab = function () { 14 this.options = { 15 title: "", 16 bindcode: undefined, 17 url: undefined, 18 close: false 19 }; 20 var isfull = false; 21 this.init = function (setting) { 22 $.extend(this.options, setting); 23 }; 24 this.addtab = function (setting) { 25 $.extend(this.options, setting); 26 var li, litop, hasdata; 27 if (!_drop) { 28 _drop = new droplist(); 29 }; 30 hasdata = ishas(this.options); 31
if (!hasdata.has) { 32 li = $('' + this.options.title + '×'); 33 li.data("data", $.extend(true, {}, this.options)); 34 } else { 35 li = hasdata.selector.off("click"); 36 }; 37 li.prependTo(options.selector); 38 li.find("span.close").show().on("click", function () { 39 closetab(this); 40 }); 41 options.selector.children("li").not(li).removeClass("active"); 42 li.addClass("active"); 43 litop = _drop.options.selector.position().top, paneltop = options.selector.position().top; 44 if (litop > paneltop) { //超出检测 45 _drop.addDropItem(); 46 }; 47 }; 48 49 function closetab(target)
{ 50 var pager = $(target).parent().attr("href"); 51 $(target).closest("li").remove(); 52 options.selector.next().find(pager).remove(); 53 if (options.selector.find("li.active").length <= 0) { 54 options.selector.find("li>a:first").tab("show"); 55 }; 56 57 var li = _drop.options.ulpanel.children("li:first"); 58 if (li.length <= 0) return; 59 li.find("span.close").show(); 60 _drop.options.selector.before(li); 61 if (_drop.options.selector.position().top > options.selector.position().top) { 62 li.find("span.close").hide(); 63 _drop.options.ulpanel.append(li); 64 return; 65 }; 66 li.off("click"); 67 if (_drop.options.ulpanel.children("li").length <= 0) { 68
_drop.options.selector.css({ "visibility": "hidden" }); 69 }; 70 }; 71 72 function ishas(setting) {//检测选项卡是否存在 73 var lis = options.selector.find("li"), lidata, hasdata; 74 hasdata = { selector: undefined, has: false }; 75 $.each(lis, function () { 76 lidata = $(this).data("data"); 77 if (!lidata) return true; 78 if (lidata.title === setting.title && lidata.bindcode === setting.bindcode && lidata.url === setting.url) { 79 hasdata = { selector: $(this), has: true }; 80 return false; 81 }; 82 }); 83 return hasdata; 84 }; 85 }; 86 87 var tabcontent = function () { 88 this.options = { 89 selector:undefined 90 }; 91
var option = { 92 bindcode: undefined, 93 url: undefined, 94 content:undefined 95 }; 96 97 this.init = function () { 98 var content = $('
'); 99 this.options.selector = content;100 options.selector.after(this.options.selector);101 };102 this.addContent = function (setting) {103 var page,iframe;104 $.extend(option, setting);105 hasdata = ishas(option);106 if (!hasdata.has) {107 page = $('
').data("data", $.extend(true, {}, option));108 if (!option.url) {109 page.html(option.content);110 } else {111
iframe = $('
');112 page.append(iframe);113 };114 page.appendTo(this.options.selector);115 } else {116 page = hasdata.selector;117 };118 this.options.selector.children("div").not(page).removeClass("active");119 page.addClass("active");120 };121 122 function ishas(setting) {//检测选项卡是否存在123 var divs = _tabcontent.options.selector.children("div"), divdata, hasdata;124124 hasdata = { selector: undefined, has: false };125 $.each(divs, function () {126 divdata = $(this).data("data");127 if (!divdata) return true;128 if (divdata.bindcode === setting.bindcode) {129
hasdata = { selector: $(this), has: true };130 return false;131 };132 });133 return hasdata;134 };135 };136 137 var droplist = function () {138 this.options = {139 selector: undefined,140 ulpanel: undefined141 };142 143 this.init = function (panel) {144 var li = $('
');145 this.options.selector = li.css({ "visibility": "hidden" });146 this.options.ulpanel = li.children("ul");147 this.options.selector.appendTo(panel);148 };149 150 this.addDropItem = function () {151 additem(this.options.selector, this.options.ulpanel);152 };153 154
function additem(li, ul) {155 var item = options.selector.children("li").not(li).last();156 li.css({ "visibility": "visible" });157 if (item.length <= 0) return;158 item.find("span.close").hide();159 ul.append(item);160 item.one("click", function () {161 itemtarget(this, li, ul);162 });163 };164 165 function itemtarget(target, selector, ulpanel) {166 var item = options.selector.children("li").not(selector).last();167 $(target).find("span.close").show();168 $(target).prependTo(options.selector);169 if (item.length <= 0) return;170 if (selector.position().top > options.selector.position().top) {171 item.find("span.close").hide();172 ulpanel.append(item);173 };174
item.one("click", function () {175 itemtarget(this, selector, ulpanel);176 });177 };178 };179 180 function init(setting) {181 $.extend(options, setting);182 if (!options.selector) {183 return;184 };185 if (options.selector[0].tagName.toLowerCase() != "ul") {186 var selector = $('
').appendTo(options.selector);187 options.selector = selector;188 };189 if (!_drop) {190 _drop = new droplist();191 };192 _drop.init(options.selector);193 194 if (!_tabcontent) {195 _tabcontent = new tabcontent();196 };197 _tabcontent.init();198 if (!_newtab) {199 _newtab = new tab();200 };201 };
function addtab(setting)
{
if (!_newtab) {205
_newtab = new tab();206 };
_newtab.addtab(setting);208
if (!_tabcontent) {209 _tabcontent = new tabcontent();210 };211
_tabcontent.addContent(setting);212
options.selector.find('li>a').filter('[href=#page' + setting.bindcode + ']').tab("show");213 };
return {216 init: function (setting) {217 init(setting);218 },
addtab: function (setting) {219 addtab(setting);220 }221 };222 })
(jQuery);
