async: false,
data: { target_id: tab.id },
success: function (result) {
content.html(result);
}
});
} else {
content.html(tab.content);
}
contents.append(content);
if (tab.selected) {
$this.tabs("select", tab);
}
} else {
$this.tabs("select", tab);
}
},
select: function (tab) {
var $this = $(this);
var settings = $this.data("tw.tabs");
$this.find("." + settings.style.selected).removeClass(settings.style.selected);
if (typeof tab == "object") {
$this.find("[data-tab='" + tab.id + "']").addClass(settings.style.selected);
} else {
$this.find("." + settings.style.header).eq(tab).addClass(settings.style.selected);
$this.find("." + settings.style.content).eq(tab).addClass(settings.style.selected);
}
if (settings.onchanged) {
settings.onchanged(tab);
}
},
refresh: function () {
var $this = $(this);
var selected = $this.find("." + settings.style.selected);
var tab = $this.find("." + settings.style.header).data("tw.tab");
if (settings.type == "iframe") {
selected.find("iframe").attr('src', tab.url + "?target_id=" + tab.id);
} else if (settings.type == "ajax") {
$.ajax({
url: tab.url,
type: "post",
async: false,
data: { target_id: tab.id },
success: function (result) {
content.html(result);
}
});
} else {
content.html(tab.content);
}
},
remove: function (id) {
var $this = $(this);
var settings = $this.data("tw.tabs");
var tab = $this.find("[data-tab='" + id + "']");
if (tab.find("." + settings.style.selected)) {
var index = tab.eq(0).index() - 1;
$this.tabs("select", index);
}
tab.remove();
},
destroy: function (options) {
return $(this).each(function () {
var $this = $(this);
$this.removeData('tabs');
});
}
}
$.fn.tabs = function () {
var method = arguments[0];
var args = arguments;
if (typeof (method) == 'object' || !method) {
method = methods.init;
} else if (methods[method]) {
method = methods[method];
args = $.makeArray(arguments).slice(1);
} else {
$.error('Method ' + method + ' does not exist on tw.tabs');
return this;
}
return method.apply(this, args);
}
}
)(jQuery);
.tabs {
width:100%;
height:100%;
}
.tabs .tab-headers {
margin:0;
padding:0 10px;
height:40px;
list-style:none;
background:#f5f5f5;
border-bottom:1px solid #ccc;
}
.tabs .tab-headers .tab-header {
float:left;
height:30px;
font-size:12px;
padding:7px 15px 0;
margin-top:10px;
margin-right:5px;
border:1px solid #ccc;
