这是jQuery的正确用法吗?

在定义选项卡的行为时,应使用更通用的方法:

$('#tabs a').click(function(){
    $("#tabcontent > div").hide();
    $("#"+this.id+"content").show();
    $("#tabs > li a").removeClass().addClass("inactivetab");
    $(this).removeClass().addClass("activetab");
});

您不需要为每个选项卡重复代码。相反,编写一个应用于所有选项卡的函数(使用jQuery选择查找父节点和子节点),并将该函数绑定到选项卡的单击处理程序(您需要一个新类来标识哪些元素是选项卡)。

The jQuery you see for tab1 is repeated for each tab.

我宁愿选择通用的解决方案。对所有选项卡使用“tab”类,并为此编写一个单击处理程序。使用$(this)引用单击的内容。

您应该能够编写单个函数,每个选项卡都可以调用该函数。或者,您可以这样做:

$("#tab1, #tab2").click(function() {
  var tab = $(this);
  var tabContent = $('#' + tab.attr('id') + 'content');
  // etc.
});

此外,为非活动选项卡添加类可能是多余的,因为如果选项卡没有活动类,则可以将其视为非活动。

或者你可以直接使用 tabs jQuery UI

$("#tabs").tabs();

您的思路是对的,我不建议为每次单击选项卡编写命令。jQueryUI有一个选项卡特性 http://jqueryui.com/demos/tabs/

也可能有助于查看 toggle 效果。