UU跑腿标准版

ligerTab.js 35KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925
  1. /**
  2. * jQuery ligerUI 1.2.4
  3. *
  4. * http://ligerui.com
  5. *
  6. * Author daomi 2014 [ gd_star@163.com ]
  7. *
  8. */
  9. (function ($)
  10. {
  11. $.fn.ligerTab = function (options)
  12. {
  13. return $.ligerui.run.call(this, "ligerTab", arguments);
  14. };
  15. $.fn.ligerGetTabManager = function ()
  16. {
  17. return $.ligerui.run.call(this, "ligerGetTabManager", arguments);
  18. };
  19. $.ligerDefaults.Tab = {
  20. height: null,
  21. heightDiff: 0, // 高度补差
  22. changeHeightOnResize: false,
  23. contextmenu: true,
  24. dblClickToClose: false, //是否双击时关闭
  25. dragToMove: false, //是否允许拖动时改变tab项的位置
  26. showSwitch: false, //显示切换窗口按钮
  27. showSwitchInTab: false, //切换窗口按钮显示在最后一项
  28. onBeforeOverrideTabItem: null,
  29. onAfterOverrideTabItem: null,
  30. onBeforeRemoveTabItem: null,
  31. onAfterRemoveTabItem: null,
  32. onBeforeAddTabItem: null,
  33. onAfterAddTabItem: null,
  34. onBeforeSelectTabItem: null,
  35. onAfterSelectTabItem: null,
  36. onCloseOther: null,
  37. onCloseAll: null,
  38. onClose: null,
  39. onReload: null
  40. };
  41. $.ligerDefaults.TabString = {
  42. closeMessage: "关闭当前页",
  43. closeOtherMessage: "关闭其他",
  44. closeAllMessage: "关闭所有",
  45. reloadMessage: "刷新"
  46. };
  47. $.ligerMethos.Tab = {};
  48. $.ligerui.controls.Tab = function (element, options)
  49. {
  50. $.ligerui.controls.Tab.base.constructor.call(this, element, options);
  51. };
  52. $.ligerui.controls.Tab.ligerExtend($.ligerui.core.UIComponent, {
  53. __getType: function ()
  54. {
  55. return 'Tab';
  56. },
  57. __idPrev: function ()
  58. {
  59. return 'Tab';
  60. },
  61. _extendMethods: function ()
  62. {
  63. return $.ligerMethos.Tab;
  64. },
  65. _render: function ()
  66. {
  67. var g = this, p = this.options;
  68. if (p.height) g.makeFullHeight = true;
  69. g.tab = $(this.element);
  70. g.tab.addClass("l-tab");
  71. if (p.contextmenu && $.ligerMenu)
  72. {
  73. g.tab.menu = $.ligerMenu({ width: 100, items: [
  74. { text: p.closeMessage, id: 'close', click: function ()
  75. {
  76. g._menuItemClick.apply(g, arguments);
  77. }
  78. },
  79. { text: p.closeOtherMessage, id: 'closeother', click: function ()
  80. {
  81. g._menuItemClick.apply(g, arguments);
  82. }
  83. },
  84. { text: p.closeAllMessage, id: 'closeall', click: function ()
  85. {
  86. g._menuItemClick.apply(g, arguments);
  87. }
  88. },
  89. { text: p.reloadMessage, id: 'reload', click: function ()
  90. {
  91. g._menuItemClick.apply(g, arguments);
  92. }
  93. }
  94. ]
  95. });
  96. }
  97. g.tab.content = $('<div class="l-tab-content"></div>');
  98. $("> div", g.tab).appendTo(g.tab.content);
  99. g.tab.content.appendTo(g.tab);
  100. g.tab.links = $('<div class="l-tab-links"><ul style="left: 0px; "></ul><div class="l-tab-switch"></div></div>');
  101. g.tab.links.prependTo(g.tab);
  102. g.tab.links.ul = $("ul", g.tab.links);
  103. var lselecteds = $("> div[lselected=true]", g.tab.content);
  104. var haslselected = lselecteds.length > 0;
  105. g.selectedTabId = lselecteds.attr("tabid");
  106. $("> div", g.tab.content).each(function (i, box)
  107. {
  108. var li = $('<li class=""><a></a><div class="l-tab-links-item-left"></div><div class="l-tab-links-item-right"></div></li>');
  109. var contentitem = $(this);
  110. if (contentitem.attr("title"))
  111. {
  112. $("> a", li).html(contentitem.attr("title"));
  113. contentitem.attr("title", "");
  114. }
  115. var tabid = contentitem.attr("tabid");
  116. if (tabid == undefined)
  117. {
  118. tabid = g.getNewTabid();
  119. contentitem.attr("tabid", tabid);
  120. if (contentitem.attr("lselected"))
  121. {
  122. g.selectedTabId = tabid;
  123. }
  124. }
  125. li.attr("tabid", tabid);
  126. if (!haslselected && i == 0) g.selectedTabId = tabid;
  127. var showClose = contentitem.attr("showClose");
  128. if (showClose)
  129. {
  130. li.append("<div class='l-tab-links-item-close'></div>");
  131. }
  132. $("> ul", g.tab.links).append(li);
  133. if (!contentitem.hasClass("l-tab-content-item")) contentitem.addClass("l-tab-content-item");
  134. if (contentitem.find("iframe").length > 0)
  135. {
  136. var iframe = $("iframe:first", contentitem);
  137. if (iframe[0].readyState != "complete")
  138. {
  139. if (contentitem.find(".l-tab-loading:first").length == 0)
  140. contentitem.prepend("<div class='l-tab-loading' style='display:block;'></div>");
  141. var iframeloading = $(".l-tab-loading:first", contentitem);
  142. iframe.bind('load.tab', function ()
  143. {
  144. iframeloading.hide();
  145. });
  146. }
  147. }
  148. });
  149. //init
  150. g.selectTabItem(g.selectedTabId);
  151. //set content height
  152. if (p.height)
  153. {
  154. if (typeof (p.height) == 'string' && p.height.indexOf('%') > 0)
  155. {
  156. g.onResize();
  157. if (p.changeHeightOnResize)
  158. {
  159. $(window).resize(function ()
  160. {
  161. g.onResize.call(g);
  162. });
  163. }
  164. } else
  165. {
  166. g.setHeight(p.height);
  167. }
  168. }
  169. if (g.makeFullHeight)
  170. g.setContentHeight();
  171. //add even
  172. $("li", g.tab.links).each(function ()
  173. {
  174. g._addTabItemEvent($(this));
  175. });
  176. g.tab.bind('dblclick.tab', function (e)
  177. {
  178. if (!p.dblClickToClose) return;
  179. g.dblclicking = true;
  180. var obj = (e.target || e.srcElement);
  181. var tagName = obj.tagName.toLowerCase();
  182. if (tagName == "a")
  183. {
  184. var tabid = $(obj).parent().attr("tabid");
  185. var allowClose = $(obj).parent().find("div.l-tab-links-item-close").length ? true : false;
  186. if (allowClose)
  187. {
  188. g.removeTabItem(tabid);
  189. }
  190. }
  191. g.dblclicking = false;
  192. });
  193. g.set(p);
  194. },
  195. _setShowSwitch: function (value)
  196. {
  197. var g = this, p = this.options;
  198. if (value)
  199. {
  200. if (!$(".l-tab-switch", g.tab.links).length)
  201. {
  202. $("<div class='l-tab-switch'></div>").appendTo(g.tab.links);
  203. }
  204. $(g.tab).addClass("l-tab-switchable");
  205. $(".l-tab-switch", g.tab).click(function ()
  206. {
  207. g.toggleSwitch(this);
  208. });
  209. }
  210. else
  211. {
  212. $(g.tab).removeClass("l-tab-switchable");
  213. $("body > .l-tab-windowsswitch").remove();
  214. }
  215. },
  216. _setShowSwitchInTab:function(value)
  217. {
  218. var g = this, p = this.options;
  219. if (p.showSwitch && value)
  220. {
  221. $(g.tab).removeClass("l-tab-switchable");
  222. $(".l-tab-switch", g.tab).remove();
  223. var tabitem = $("<li class='l-tab-itemswitch'><a></a><div class='l-tab-links-item-left'></div><div class='l-tab-links-item-right'></div></li>");
  224. tabitem.appendTo(g.tab.links.ul);
  225. tabitem.click(function ()
  226. {
  227. g.toggleSwitch(this);
  228. });
  229. } else
  230. {
  231. $(".l-tab-itemswitch", g.tab.ul).remove();
  232. }
  233. },
  234. toggleSwitch: function (btn)
  235. {
  236. var g = this, p = this.options;
  237. if ($("body > .l-tab-windowsswitch").length)
  238. {
  239. $("body > .l-tab-windowsswitch").remove();
  240. return;
  241. }
  242. if (btn == null) return;
  243. var windowsswitch = $("<div class='l-tab-windowsswitch'></div>").appendTo('body');
  244. var tabItems = g.tab.links.ul.find('>li');
  245. var selectedTabItemID = g.getSelectedTabItemID();
  246. tabItems.each(function (i, item)
  247. {
  248. var jlink = $("<a href='javascript:void(0)'></a>");
  249. jlink.text($(item).find("a").text());
  250. var tabid = $(item).attr("tabid");
  251. if (tabid == null) return;
  252. if (tabid == selectedTabItemID)
  253. {
  254. jlink.addClass("selected");
  255. }
  256. jlink.attr("tabid", tabid);
  257. windowsswitch.append(jlink);
  258. });
  259. windowsswitch.css({
  260. top: $(btn).offset().top + $(btn).height(),
  261. left: $(btn).offset().left - windowsswitch.width()
  262. });
  263. windowsswitch.bind("click", function (e)
  264. {
  265. var obj = (e.target || e.srcElement);
  266. if (obj.tagName.toLowerCase() == "a")
  267. {
  268. var tabid = $(obj).attr("tabid");
  269. g.selectTabItem(tabid);
  270. g.moveToTabItem(tabid);
  271. $("body > .l-tab-windowsswitch").remove();
  272. return;
  273. }
  274. });
  275. },
  276. _applyDrag: function (tabItemDom)
  277. {
  278. var g = this, p = this.options;
  279. g.droptip = g.droptip || $("<div class='l-tab-drag-droptip' style='display:none'><div class='l-drop-move-up'></div><div class='l-drop-move-down'></div></div>").appendTo('body');
  280. var drag = $(tabItemDom).ligerDrag(
  281. {
  282. revert: true, animate: false,
  283. proxy: function ()
  284. {
  285. var name = $(this).find("a").html();
  286. g.dragproxy = $("<div class='l-tab-drag-proxy' style='display:none'><div class='l-drop-icon l-drop-no'></div></div>").appendTo('body');
  287. g.dragproxy.append(name);
  288. return g.dragproxy;
  289. },
  290. onRendered: function ()
  291. {
  292. this.set('cursor', 'pointer');
  293. },
  294. onStartDrag: function (current, e)
  295. {
  296. if (!$(tabItemDom).hasClass("l-selected")) return false;
  297. if (e.button == 2) return false;
  298. var obj = e.srcElement || e.target;
  299. if ($(obj).hasClass("l-tab-links-item-close")) return false;
  300. },
  301. onDrag: function (current, e)
  302. {
  303. if (g.dropIn == null)
  304. g.dropIn = -1;
  305. var tabItems = g.tab.links.ul.find('>li');
  306. var targetIndex = tabItems.index(current.target);
  307. tabItems.each(function (i, item)
  308. {
  309. if (targetIndex == i)
  310. {
  311. return;
  312. }
  313. var isAfter = i > targetIndex;
  314. if (g.dropIn != -1 && g.dropIn != i) return;
  315. var offset = $(this).offset();
  316. var range = {
  317. top: offset.top,
  318. bottom: offset.top + $(this).height(),
  319. left: offset.left - 10,
  320. right: offset.left + 10
  321. };
  322. if (isAfter)
  323. {
  324. range.left += $(this).width();
  325. range.right += $(this).width();
  326. }
  327. var pageX = e.pageX || e.screenX;
  328. var pageY = e.pageY || e.screenY;
  329. if (pageX > range.left && pageX < range.right && pageY > range.top && pageY < range.bottom)
  330. {
  331. g.droptip.css({
  332. left: range.left + 5,
  333. top: range.top - 9
  334. }).show();
  335. g.dropIn = i;
  336. g.dragproxy.find(".l-drop-icon").removeClass("l-drop-no").addClass("l-drop-yes");
  337. }
  338. else
  339. {
  340. g.dropIn = -1;
  341. g.droptip.hide();
  342. g.dragproxy.find(".l-drop-icon").removeClass("l-drop-yes").addClass("l-drop-no");
  343. }
  344. });
  345. },
  346. onStopDrag: function (current, e)
  347. {
  348. if (g.dropIn > -1)
  349. {
  350. var to = g.tab.links.ul.find('>li:eq(' + g.dropIn + ')').attr("tabid");
  351. var from = $(current.target).attr("tabid");
  352. setTimeout(function ()
  353. {
  354. g.moveTabItem(from, to);
  355. }, 0);
  356. g.dropIn = -1;
  357. g.dragproxy.remove();
  358. }
  359. g.droptip.hide();
  360. this.set('cursor', 'default');
  361. }
  362. });
  363. return drag;
  364. },
  365. _setDragToMove: function (value)
  366. {
  367. if (!$.fn.ligerDrag) return; //需要ligerDrag的支持
  368. var g = this, p = this.options;
  369. if (value)
  370. {
  371. if (g.drags) return;
  372. g.drags = g.drags || [];
  373. g.tab.links.ul.find('>li').each(function ()
  374. {
  375. g.drags.push(g._applyDrag(this));
  376. });
  377. }
  378. },
  379. moveTabItem: function (fromTabItemID, toTabItemID)
  380. {
  381. var g = this;
  382. var from = g.tab.links.ul.find(">li[tabid=" + fromTabItemID + "]");
  383. var to = g.tab.links.ul.find(">li[tabid=" + toTabItemID + "]");
  384. var index1 = g.tab.links.ul.find(">li").index(from);
  385. var index2 = g.tab.links.ul.find(">li").index(to);
  386. if (index1 < index2)
  387. {
  388. to.after(from);
  389. }
  390. else
  391. {
  392. to.before(from);
  393. }
  394. },
  395. //设置tab按钮(左和右),显示返回true,隐藏返回false
  396. setTabButton: function ()
  397. {
  398. var g = this, p = this.options;
  399. var sumwidth = 0;
  400. $("li", g.tab.links.ul).each(function ()
  401. {
  402. sumwidth += $(this).width() + 2;
  403. });
  404. var mainwidth = g.tab.width();
  405. if (sumwidth > mainwidth)
  406. {
  407. if (!$(".l-tab-links-left", g.tab).length)
  408. {
  409. g.tab.links.append('<div class="l-tab-links-left"><span></span></div><div class="l-tab-links-right"><span></span></div>');
  410. g.setTabButtonEven();
  411. }
  412. return true;
  413. } else
  414. {
  415. g.tab.links.ul.animate({ left: 0 });
  416. $(".l-tab-links-left,.l-tab-links-right", g.tab.links).remove();
  417. return false;
  418. }
  419. },
  420. //设置左右按钮的事件 标签超出最大宽度时,可左右拖动
  421. setTabButtonEven: function ()
  422. {
  423. var g = this, p = this.options;
  424. $(".l-tab-links-left", g.tab.links).hover(function ()
  425. {
  426. $(this).addClass("l-tab-links-left-over");
  427. }, function ()
  428. {
  429. $(this).removeClass("l-tab-links-left-over");
  430. }).click(function ()
  431. {
  432. g.moveToPrevTabItem();
  433. });
  434. $(".l-tab-links-right", g.tab.links).hover(function ()
  435. {
  436. $(this).addClass("l-tab-links-right-over");
  437. }, function ()
  438. {
  439. $(this).removeClass("l-tab-links-right-over");
  440. }).click(function ()
  441. {
  442. g.moveToNextTabItem();
  443. });
  444. },
  445. //切换到上一个tab
  446. moveToPrevTabItem: function (tabid)
  447. {
  448. var g = this, p = this.options;
  449. var tabItems = $("> li", g.tab.links.ul),
  450. nextBtn = $(".l-tab-links-right", g.tab),
  451. prevBtn = $(".l-tab-links-left", g.tab);
  452. if (!nextBtn.length || !prevBtn.length) return false;
  453. var nextBtnOffset = nextBtn.offset(), prevBtnOffset = prevBtn.offset();
  454. //计算应该移动到的标签项,并计算从第一项到这个标签项的上一项的宽度总和
  455. var moveToTabItem = null, currentWidth = 0;
  456. var prevBtnLeft = prevBtnOffset.left + prevBtn.outerWidth();
  457. for (var i = 0, l = tabItems.length; i < l; i++)
  458. {
  459. var tabitem = $(tabItems[i]);
  460. var offset = tabitem.offset();
  461. var start = offset.left, end = offset.left + tabitem.outerWidth();
  462. if (tabid != null)
  463. {
  464. if (start < prevBtnLeft && tabitem.attr("tabid") == tabid)
  465. {
  466. moveToTabItem = tabitem;
  467. break;
  468. }
  469. }
  470. else if (start < prevBtnLeft && end >= prevBtnLeft)
  471. {
  472. moveToTabItem = tabitem;
  473. break;
  474. }
  475. currentWidth += tabitem.outerWidth() + parseInt(tabitem.css("marginLeft"))
  476. + parseInt(tabitem.css("marginRight"));
  477. }
  478. if (moveToTabItem == null) return false;
  479. //计算出正确的移动位置
  480. var left = currentWidth - prevBtn.outerWidth();
  481. g.tab.links.ul.animate({ left: -1 * left });
  482. return true;
  483. },
  484. //切换到下一个tab
  485. moveToNextTabItem: function (tabid)
  486. {
  487. var g = this, p = this.options;
  488. var tabItems = $("> li", g.tab.links.ul),
  489. nextBtn = $(".l-tab-links-right", g.tab),
  490. prevBtn = $(".l-tab-links-left", g.tab);
  491. if (!nextBtn.length || !prevBtn.length) return false;
  492. var nextBtnOffset = nextBtn.offset(), prevBtnOffset = prevBtn.offset();
  493. //计算应该移动到的标签项,并计算从第一项到这个标签项的宽度总和
  494. var moveToTabItem = null, currentWidth = 0;
  495. for (var i = 0, l = tabItems.length; i < l; i++)
  496. {
  497. var tabitem = $(tabItems[i]);
  498. currentWidth += tabitem.outerWidth()
  499. + parseInt(tabitem.css("marginLeft"))
  500. + parseInt(tabitem.css("marginRight"));
  501. var offset = tabitem.offset();
  502. var start = offset.left, end = offset.left + tabitem.outerWidth();
  503. if (tabid != null)
  504. {
  505. if (end > nextBtnOffset.left && tabitem.attr("tabid") == tabid)
  506. {
  507. moveToTabItem = tabitem;
  508. break;
  509. }
  510. }
  511. else if (start <= nextBtnOffset.left && end > nextBtnOffset.left)
  512. {
  513. moveToTabItem = tabitem;
  514. break;
  515. }
  516. }
  517. if (moveToTabItem == null) return false;
  518. //计算出正确的移动位置
  519. var left = currentWidth - (nextBtnOffset.left - prevBtnOffset.left)
  520. + parseInt(moveToTabItem.css("marginLeft")) + parseInt(moveToTabItem.css("marginRight"));
  521. g.tab.links.ul.animate({ left: -1 * left });
  522. return true;
  523. },
  524. //切换到指定的项目项
  525. moveToTabItem: function (tabid)
  526. {
  527. var g = this, p = this.options;
  528. if (!g.moveToPrevTabItem(tabid))
  529. {
  530. g.moveToNextTabItem(tabid);
  531. }
  532. },
  533. getTabItemCount: function ()
  534. {
  535. var g = this, p = this.options;
  536. return $("li", g.tab.links.ul).length;
  537. },
  538. getSelectedTabItemID: function ()
  539. {
  540. var g = this, p = this.options;
  541. return $("li.l-selected", g.tab.links.ul).attr("tabid");
  542. },
  543. removeSelectedTabItem: function ()
  544. {
  545. var g = this, p = this.options;
  546. g.removeTabItem(g.getSelectedTabItemID());
  547. },
  548. //覆盖选择的tabitem
  549. overrideSelectedTabItem: function (options)
  550. {
  551. var g = this, p = this.options;
  552. g.overrideTabItem(g.getSelectedTabItemID(), options);
  553. },
  554. //覆盖
  555. overrideTabItem: function (targettabid, options)
  556. {
  557. var g = this, p = this.options;
  558. if (g.trigger('beforeOverrideTabItem', [targettabid]) == false)
  559. return false;
  560. var tabid = options.tabid;
  561. if (tabid == undefined) tabid = g.getNewTabid();
  562. var url = options.url;
  563. var content = options.content;
  564. var target = options.target;
  565. var text = options.text;
  566. var showClose = options.showClose;
  567. var height = options.height;
  568. //如果已经存在
  569. if (g.isTabItemExist(tabid))
  570. {
  571. return;
  572. }
  573. var tabitem = $("li[tabid=" + targettabid + "]", g.tab.links.ul);
  574. var contentitem = $(".l-tab-content-item[tabid=" + targettabid + "]", g.tab.content);
  575. if (!tabitem || !contentitem) return;
  576. tabitem.attr("tabid", tabid);
  577. contentitem.attr("tabid", tabid);
  578. if ($("iframe", contentitem).length == 0 && url)
  579. {
  580. contentitem.html("<iframe frameborder='0'></iframe>");
  581. }
  582. else if (content)
  583. {
  584. contentitem.html(content);
  585. }
  586. $("iframe", contentitem).attr("name", tabid);
  587. if (showClose == undefined) showClose = true;
  588. if (showClose == false) $(".l-tab-links-item-close", tabitem).remove();
  589. else
  590. {
  591. if ($(".l-tab-links-item-close", tabitem).length == 0)
  592. tabitem.append("<div class='l-tab-links-item-close'></div>");
  593. }
  594. if (text == undefined) text = tabid;
  595. if (height) contentitem.height(height);
  596. $("a", tabitem).text(text);
  597. $("iframe", contentitem).attr("src", url);
  598. g.trigger('afterOverrideTabItem', [targettabid]);
  599. },
  600. //设置页签项标题
  601. setHeader: function(tabid,header)
  602. {
  603. $("li[tabid=" + tabid + "] a", this.tab.links.ul).text(header);
  604. },
  605. //选中tab项
  606. selectTabItem: function (tabid)
  607. {
  608. var g = this, p = this.options;
  609. if (g.trigger('beforeSelectTabItem', [tabid]) == false)
  610. return false;
  611. g.selectedTabId = tabid;
  612. $("> .l-tab-content-item[tabid=" + tabid + "]", g.tab.content).show().siblings().hide();
  613. $("li[tabid=" + tabid + "]", g.tab.links.ul).addClass("l-selected").siblings().removeClass("l-selected");
  614. g.trigger('afterSelectTabItem', [tabid]);
  615. },
  616. //移动到最后一个tab
  617. moveToLastTabItem: function ()
  618. {
  619. var g = this, p = this.options;
  620. var sumwidth = 0;
  621. $("li", g.tab.links.ul).each(function ()
  622. {
  623. sumwidth += $(this).width() + 2;
  624. });
  625. var mainwidth = g.tab.width();
  626. if (sumwidth > mainwidth)
  627. {
  628. var btnWitdth = $(".l-tab-links-right", g.tab.links).width();
  629. g.tab.links.ul.animate({ left: -1 * (sumwidth - mainwidth + btnWitdth + 2) });
  630. }
  631. },
  632. //判断tab是否存在
  633. isTabItemExist: function (tabid)
  634. {
  635. var g = this, p = this.options;
  636. return $("li[tabid=" + tabid + "]", g.tab.links.ul).length > 0;
  637. },
  638. //增加一个tab
  639. addTabItem: function (options)
  640. {
  641. var g = this, p = this.options;
  642. if (g.trigger('beforeAddTabItem', [options]) == false)
  643. return false;
  644. var tabid = options.tabid;
  645. if (tabid == undefined) tabid = g.getNewTabid();
  646. var url = options.url, content = options.content, text = options.text, showClose = options.showClose, height = options.height;
  647. //如果已经存在
  648. if (g.isTabItemExist(tabid))
  649. {
  650. g.selectTabItem(tabid);
  651. return;
  652. }
  653. var tabitem = $("<li><a></a><div class='l-tab-links-item-left'></div><div class='l-tab-links-item-right'></div><div class='l-tab-links-item-close'></div></li>");
  654. var contentitem = $("<div class='l-tab-content-item'><div class='l-tab-loading' style='display:block;'></div><iframe frameborder='0'></iframe></div>");
  655. var iframeloading = $("div:first", contentitem);
  656. var iframe = $("iframe:first", contentitem);
  657. if (g.makeFullHeight)
  658. {
  659. var newheight = g.tab.height() - g.tab.links.height();
  660. contentitem.height(newheight);
  661. }
  662. tabitem.attr("tabid", tabid);
  663. contentitem.attr("tabid", tabid);
  664. if (url)
  665. {
  666. iframe[0].tab = g;//增加iframe对tab对象的引用
  667. iframe.attr("name", tabid)
  668. .attr("id", tabid)
  669. .attr("src", url)
  670. .bind('load.tab', function ()
  671. {
  672. iframeloading.hide();
  673. if (options.callback)
  674. options.callback();
  675. });
  676. }
  677. else
  678. {
  679. iframe.remove();
  680. iframeloading.remove();
  681. }
  682. if (content)
  683. {
  684. contentitem.html(content);
  685. if (options.callback)
  686. options.callback();
  687. }
  688. else if (options.target)
  689. {
  690. contentitem.append(options.target);
  691. if (options.callback)
  692. options.callback();
  693. }
  694. if (showClose == undefined) showClose = true;
  695. if (showClose == false) $(".l-tab-links-item-close", tabitem).remove();
  696. if (text == undefined) text = tabid;
  697. if (height) contentitem.height(height);
  698. $("a", tabitem).text(text);
  699. if ($(".l-tab-itemswitch", g.tab.links.ul).length)
  700. {
  701. tabitem.insertBefore($(".l-tab-itemswitch", g.tab.links.ul));
  702. } else
  703. {
  704. g.tab.links.ul.append(tabitem);
  705. }
  706. g.tab.content.append(contentitem);
  707. g.selectTabItem(tabid);
  708. if (g.setTabButton())
  709. {
  710. g.moveToTabItem(tabid);
  711. }
  712. //增加事件
  713. g._addTabItemEvent(tabitem);
  714. if (p.dragToMove && $.fn.ligerDrag)
  715. {
  716. g.drags = g.drags || [];
  717. tabitem.each(function ()
  718. {
  719. g.drags.push(g._applyDrag(this));
  720. });
  721. }
  722. g.toggleSwitch();
  723. g.trigger('afterAddTabItem', [options]);
  724. },
  725. _addTabItemEvent: function (tabitem)
  726. {
  727. var g = this, p = this.options;
  728. tabitem.click(function ()
  729. {
  730. var tabid = $(this).attr("tabid");
  731. g.selectTabItem(tabid);
  732. });
  733. //右键事件支持
  734. g.tab.menu && g._addTabItemContextMenuEven(tabitem);
  735. $(".l-tab-links-item-close", tabitem).hover(function ()
  736. {
  737. $(this).addClass("l-tab-links-item-close-over");
  738. }, function ()
  739. {
  740. $(this).removeClass("l-tab-links-item-close-over");
  741. }).click(function ()
  742. {
  743. var tabid = $(this).parent().attr("tabid");
  744. g.removeTabItem(tabid);
  745. });
  746. },
  747. //移除tab项
  748. removeTabItem: function (tabid)
  749. {
  750. var g = this, p = this.options;
  751. if (g.trigger('beforeRemoveTabItem', [tabid]) == false)
  752. return false;
  753. var currentIsSelected = $("li[tabid=" + tabid + "]", g.tab.links.ul).hasClass("l-selected");
  754. if (currentIsSelected)
  755. {
  756. $(".l-tab-content-item[tabid=" + tabid + "]", g.tab.content).prev().show();
  757. $("li[tabid=" + tabid + "]", g.tab.links.ul).prev().addClass("l-selected").siblings().removeClass("l-selected");
  758. }
  759. var contentItem = $(".l-tab-content-item[tabid=" + tabid + "]", g.tab.content);
  760. var jframe = $('iframe', contentItem);
  761. if (jframe.length)
  762. {
  763. var frame = jframe[0];
  764. frame.src = "about:blank";
  765. frame.contentWindow.document.write('');
  766. $.browser.msie && CollectGarbage();
  767. jframe.remove();
  768. }
  769. contentItem.remove();
  770. $("li[tabid=" + tabid + "]", g.tab.links.ul).remove();
  771. g.setTabButton();
  772. g.trigger('afterRemoveTabItem', [tabid]);
  773. },
  774. addHeight: function (heightDiff)
  775. {
  776. var g = this, p = this.options;
  777. var newHeight = g.tab.height() + heightDiff;
  778. g.setHeight(newHeight);
  779. },
  780. setHeight: function (height)
  781. {
  782. var g = this, p = this.options;
  783. g.tab.height(height);
  784. g.setContentHeight();
  785. },
  786. setContentHeight: function ()
  787. {
  788. var g = this, p = this.options;
  789. var newheight = g.tab.height() - g.tab.links.height();
  790. g.tab.content.height(newheight);
  791. $("> .l-tab-content-item", g.tab.content).height(newheight);
  792. },
  793. getNewTabid: function ()
  794. {
  795. var g = this, p = this.options;
  796. g.getnewidcount = g.getnewidcount || 0;
  797. return 'tabitem' + (++g.getnewidcount);
  798. },
  799. //notabid 过滤掉tabid的
  800. //noclose 过滤掉没有关闭按钮的
  801. getTabidList: function (notabid, noclose)
  802. {
  803. var g = this, p = this.options;
  804. var tabidlist = [];
  805. $("> li", g.tab.links.ul).each(function ()
  806. {
  807. if ($(this).attr("tabid")
  808. && $(this).attr("tabid") != notabid
  809. && (!noclose || $(".l-tab-links-item-close", this).length > 0))
  810. {
  811. tabidlist.push($(this).attr("tabid"));
  812. }
  813. });
  814. return tabidlist;
  815. },
  816. removeOther: function (tabid, compel)
  817. {
  818. var g = this, p = this.options;
  819. var tabidlist = g.getTabidList(tabid, true);
  820. $(tabidlist).each(function ()
  821. {
  822. g.removeTabItem(this);
  823. });
  824. },
  825. reload: function (tabid)
  826. {
  827. var g = this, p = this.options;
  828. var contentitem = $(".l-tab-content-item[tabid=" + tabid + "]");
  829. var iframeloading = $(".l-tab-loading:first", contentitem);
  830. var iframe = $("iframe:first", contentitem);
  831. var url = $(iframe).attr("src");
  832. iframeloading.show();
  833. iframe.attr("src", url).unbind('load.tab').bind('load.tab', function ()
  834. {
  835. iframeloading.hide();
  836. });
  837. },
  838. removeAll: function (compel)
  839. {
  840. var g = this, p = this.options;
  841. var tabidlist = g.getTabidList(null, true);
  842. $(tabidlist).each(function ()
  843. {
  844. g.removeTabItem(this);
  845. });
  846. },
  847. onResize: function ()
  848. {
  849. var g = this, p = this.options;
  850. if (!p.height || typeof (p.height) != 'string' || p.height.indexOf('%') == -1) return false;
  851. //set tab height
  852. if (g.tab.parent()[0].tagName.toLowerCase() == "body")
  853. {
  854. var windowHeight = $(window).height();
  855. windowHeight -= parseInt(g.tab.parent().css('paddingTop'));
  856. windowHeight -= parseInt(g.tab.parent().css('paddingBottom'));
  857. g.height = p.heightDiff + windowHeight * parseFloat(g.height) * 0.01;
  858. }
  859. else
  860. {
  861. g.height = p.heightDiff + (g.tab.parent().height() * parseFloat(p.height) * 0.01);
  862. }
  863. g.tab.height(g.height);
  864. g.setContentHeight();
  865. },
  866. _menuItemClick: function (item)
  867. {
  868. var g = this, p = this.options;
  869. if (!item.id || !g.actionTabid) return;
  870. switch (item.id)
  871. {
  872. case "close":
  873. if (g.trigger('close') == false) return;
  874. g.removeTabItem(g.actionTabid);
  875. g.actionTabid = null;
  876. break;
  877. case "closeother":
  878. if (g.trigger('closeother') == false) return;
  879. g.removeOther(g.actionTabid);
  880. break;
  881. case "closeall":
  882. if (g.trigger('closeall') == false) return;
  883. g.removeAll();
  884. g.actionTabid = null;
  885. break;
  886. case "reload":
  887. if (g.trigger('reload', [{ tabid: g.actionTabid }]) == false) return;
  888. g.selectTabItem(g.actionTabid);
  889. g.reload(g.actionTabid);
  890. break;
  891. }
  892. },
  893. _addTabItemContextMenuEven: function (tabitem)
  894. {
  895. var g = this, p = this.options;
  896. tabitem.bind("contextmenu", function (e)
  897. {
  898. if (!g.tab.menu) return;
  899. g.actionTabid = tabitem.attr("tabid");
  900. g.tab.menu.show({ top: e.pageY, left: e.pageX });
  901. if ($(".l-tab-links-item-close", this).length == 0)
  902. {
  903. g.tab.menu.setDisabled('close');
  904. }
  905. else
  906. {
  907. g.tab.menu.setEnabled('close');
  908. }
  909. return false;
  910. });
  911. }
  912. });
  913. })(jQuery);