tabs.js 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. function _tabs(options) {
  2. var self = _widget(options),
  3. remove = self.remove,
  4. afterSelect = options.afterSelect,
  5. div = self.div,
  6. liList = [];
  7. //create tabs
  8. div.addClass('ke-tabs')
  9. .bind('contextmenu,mousedown,mousemove', function(e) {
  10. e.preventDefault();
  11. });
  12. var ul = K('<ul class="ke-tabs-ul ke-clearfix"></ul>');
  13. div.append(ul);
  14. //add a tab
  15. self.add = function(tab) {
  16. var li = K('<li class="ke-tabs-li">' + tab.title + '</li>');
  17. li.data('tab', tab);
  18. liList.push(li);
  19. ul.append(li);
  20. };
  21. self.selectedIndex = 0;
  22. //select a tab
  23. self.select = function(index) {
  24. self.selectedIndex = index;
  25. _each(liList, function(i, li) {
  26. li.unbind();
  27. if (i === index) {
  28. li.addClass('ke-tabs-li-selected');
  29. K(li.data('tab').panel).show('');
  30. } else {
  31. li.removeClass('ke-tabs-li-selected').removeClass('ke-tabs-li-on')
  32. .mouseover(function() {
  33. K(this).addClass('ke-tabs-li-on');
  34. })
  35. .mouseout(function() {
  36. K(this).removeClass('ke-tabs-li-on');
  37. })
  38. .click(function() {
  39. self.select(i);
  40. });
  41. K(li.data('tab').panel).hide();
  42. }
  43. });
  44. if (afterSelect) {
  45. afterSelect.call(self, index);
  46. }
  47. };
  48. //remove tabs
  49. self.remove = function() {
  50. _each(liList, function() {
  51. this.remove();
  52. });
  53. ul.remove();
  54. remove.call(self);
  55. };
  56. return self;
  57. }
  58. K.tabs = _tabs;