javascript - 在 HTML/CSS/Native JavaScript 中显示一个根据选项卡更改其内容的四选项卡表格的优雅方式是什么？

Question

一些背景知识:

我正在为我的公司开发一个跟踪器，每个代表都可以访问该跟踪器，以协助跟踪日常统计数据，例如通话、通话后再次接通之前花费的时间、收入和我们需要的各种销售制作。每天包括四次“旅行”，或记录统计数据的全天检查站。至此，我已经完成了代表跟踪器部分，但我无法想出一种方法来在经理 View 页面中显示每个代表的数据。我在想我想做四个选项卡来代表每次旅行，第五个选项卡来查看总数。我如何使用 native JavaScript、CSS 和 HTML 构建这样的表格？我觉得最接近解决方案的是使用 <iframe></iframe>并在里面显示四个单独的 PHP 页面，但我也认为这可能很花哨和笨拙。

我从 this 开始不久以前;它给出了我想要制作的东西的想法，尽管在此示例中它只有四个选项卡。

Answer 1

一个。使用 jquery 选项卡。非常适合您的情况。b.如果您不想沉浸在 jquery 中，请使用 jquery 逻辑:对于每个“选项卡”并使用 javascript 显示/隐藏其内容。您可以在一个程序中使用整个代码执行此操作(不推荐，但可能)，或者使用 ajax 调用和不同的程序。作为记录:在 ajax 时代之前，我曾经成功地为每个页面使用 iframe。现在听起来很尴尬，但曾经有一段时间它是一个有效的解决方案。