<ul id="tabs">
<li data-tab="users">Users</li>
<li data-tab="groups">Groups</li>
</ul>
<div id="tabsContent">
<div data-tab="users"> ... </div>
<div data-tab="groups"> ... </div>
</div>
jQuery.fn.tabs = function (control) {
var element = $(this);
control = $(control);
element.delegate("li", "click", function () {
var tabName = $(this).attr("data-tab");
element.trigger("change.tabs", tabName);
});
element.bind("change.tabs", function (e, tabName) {
element.find("li").removeClass("active");
element.find(">[data-tab='" + tabName + "']").addClass("active");
});
element.bind("change.tabs", function (e, tabName) {
control.find(">[data-tab]").removeClass("active");
control.find(">[data-tab='" + tabName + "']").addClass("active");
});
var firstName = element.find("li:first").attr("data-tab");
element.trigger("change.tabs", firstName);
return this;
};
$("ul#tabs").tabs("#tabContent");
------解决方案--------------------