dwz.tab.js 2.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. /**
  2. * @author ZhangHuihua@msn.com
  3. *
  4. */
  5. (function($){
  6. $.fn.extend({
  7. /**
  8. * options: reverse[true, false], eventType[click, hover], currentIndex[default index 0]
  9. * stTab[tabs selector], stTabPanel[tab panel selector]
  10. * ajaxClass[ajax load], closeClass[close tab]
  11. */
  12. tabs: function (options){
  13. var op = $.extend({reverse:false, eventType:"click", currentIndex:0, stTabHeader:"> .tabsHeader", stTab:">.tabsHeaderContent>ul", stTabPanel:"> .tabsContent", ajaxClass:"j-ajax", closeClass:"close", prevClass:"tabsLeft", nextClass:"tabsRight"}, options);
  14. return this.each(function(){
  15. initTab($(this));
  16. });
  17. function initTab(jT){
  18. var jSelector = jT.add($("> *", jT));
  19. var jTabHeader = $(op.stTabHeader, jSelector);
  20. var jTabs = $(op.stTab + " li", jTabHeader);
  21. var jGroups = $(op.stTabPanel + " > *", jSelector);
  22. jTabs.unbind().find("a").unbind();
  23. jTabHeader.find("."+op.prevClass).unbind();
  24. jTabHeader.find("."+op.nextClass).unbind();
  25. jTabs.each(function(iTabIndex){
  26. if (op.currentIndex == iTabIndex) $(this).addClass("selected");
  27. else $(this).removeClass("selected");
  28. if (op.eventType == "hover") $(this).hover(function(event){switchTab(jT, iTabIndex)});
  29. else $(this).click(function(event){switchTab(jT, iTabIndex)});
  30. $("a", this).each(function(){
  31. if ($(this).hasClass(op.ajaxClass)) {
  32. $(this).click(function(event){
  33. var jGroup = jGroups.eq(iTabIndex);
  34. if (this.href && !jGroup.attr("loaded")) jGroup.loadUrl(this.href,{},function(){
  35. jGroup.find("[layoutH]").layoutH();
  36. jGroup.attr("loaded",true);
  37. });
  38. event.preventDefault();
  39. });
  40. } else if ($(this).hasClass(op.closeClass)) {
  41. $(this).click(function(event){
  42. jTabs.eq(iTabIndex).remove();
  43. jGroups.eq(iTabIndex).remove();
  44. if (iTabIndex == op.currentIndex) {
  45. op.currentIndex = (iTabIndex+1 < jTabs.size()) ? iTabIndex : iTabIndex - 1;
  46. } else if (iTabIndex < op.currentIndex){
  47. op.currentIndex = iTabIndex;
  48. }
  49. initTab(jT);
  50. return false;
  51. });
  52. }
  53. });
  54. });
  55. switchTab(jT, op.currentIndex);
  56. }
  57. function switchTab(jT, iTabIndex){
  58. var jSelector = jT.add($("> *", jT));
  59. var jTabHeader = $(op.stTabHeader, jSelector);
  60. var jTabs = $(op.stTab + " li", jTabHeader);
  61. var jGroups = $(op.stTabPanel + " > *", jSelector);
  62. var jTab = jTabs.eq(iTabIndex);
  63. var jGroup = jGroups.eq(iTabIndex);
  64. if (op.reverse && (jTab.hasClass("selected") )) {
  65. jTabs.removeClass("selected");
  66. jGroups.hide();
  67. } else {
  68. op.currentIndex = iTabIndex;
  69. jTabs.removeClass("selected");
  70. jTab.addClass("selected");
  71. jGroups.hide().eq(op.currentIndex).show();
  72. }
  73. if (!jGroup.attr("inited")){
  74. jGroup.attr("inited", 1000).find("input[type=text]").filter("[alt]").inputAlert();
  75. }
  76. }
  77. }
  78. });
  79. })(jQuery);