从下拉菜单中选择元素后，如何使其显示？

Question

我有一个下拉菜单，其中列出了学校科目。我还为每个科目的考试日期设置了倒数计时器（许多科目共享一个日期）。我想让它在用户选择主题时出现正确的倒数计时器而不刷新页面。现在我使用 PHP 进行了这项工作：我有 9 个不同的 JavaScript 倒数计时器（我使用了 w3schools 的本教程）和 9 个单独的 PHP 文件，如下所示： $newSubject = $_GET["chooseSubject"];if ($newSubject == "Math" OR $newSubject == "Chemistry") {echo '<p id="subjectSet1"></p>';echo '<p class="dates">October 16. 2019 klo 9:00</p>';}我有一个按钮重定向到一个页面，然后显示正确的倒数计时器。但是，我希望实现这样的目标：https://yle.fi/aihe/artikkeli/2019/05/15/ylioppilaskokeiden-pisterajat-kevat-2019在“Ylioppilaskokeiden pisterajat, kevät 2019”下有一个选择菜单，当您选择一个主题时，它会自动显示正确的表格。

Answer 1

这就是项目设计发挥作用的地方。如果你希望你的下拉列表很小，你可以简单地在页面加载时呈现所有内容，然后使用 JS/CSS 在下拉列表更改时显示/隐藏每个内容块。

或者，如果您期望更大的数据集，这可能会影响您的页面加载时间，并使浏览器渲染数据的时间更长（即使它位于隐藏元素中）。在这种情况下，我会考虑使用 AJAX 并在您单击某个部分时加载内容。这稍微复杂一些，但是；

1. 一个很好的学习练习

2. 从长远来看更有效率

编辑：如果你想走秀/隐藏路线。这很简单，使用 jQuery。您可以选择几个选项，但我建议先切换 -请参阅此处的文档

对于 AJAX，这将需要更多的阅读。我还建议使用 jQuery 的ajax函数 -请参阅此处的文档