我有以下要求：
一个大型数据库的前端，存储有关体育学生的详细信息。例如，学生xyz玩板球，因此数据库将为他存储板球细节，学生pqr踢足球，因此数据库将为他存储足球细节等等。
主屏幕分为两个部分。左侧部分是一个搜索部分，用户可以输入几个条件。在单击搜索时，结果将作为摘要发布在右侧部分中。
例如如果搜索x导致5名学生，则摘要结果将为5行。
现在，点击摘要结果中的特定学生应该获取特定于他的所有其他详细信息，并将其作为新标签发布在同一部分中。就像在一个标签中的职业一样，他的体育详情在其他标签中。
1）如何使用CSS和Javascript实现这一目标？ 2）如何禁用其他选项卡？例如。足球选项卡不应该让学生打板球。
我是CSS和JS的新手，所以可能我的要求并不像我想的那么复杂。但我绝对需要一个起点。
答案 0 :(得分：1)
为每个选项卡使用单独的<div>部分，并在每个div上指定一个描述其使用方式的类属性。您可以通过修改其style.visibility属性来隐藏/显示div（您将其设置为'隐藏'以隐藏div，并且在大多数情况下，'阻止'以显示div）。您可以使用CSS为每个div应用不同的样式（例如它在页面上的位置）。
就个人而言，我会把它分成三个不同的任务。第一项任务是使用虚假数据将页面布局设置为正确（例如，创建一个“获取”数据的函数，但实际上只返回固定数据）。第二个任务是提供请求处理程序，它可以根据数据库中的数据返回原始的，无格式的数据（最好是JSON格式）。第三个，最后一个任务是连接用户界面中的JavaScript，以实际使用对这些端点的XHR请求获取数据，并适当地传递JSON响应，而不是传递假数据。