javascript - 表单提交后保留切换的表格

Question

我有一个 php 页面，加载时默认显示一个表格，该表格是:

echo "<table class='tftable' border='1' id='table_L'>";

还有另一张表:

echo "<table class='tftable' border='1' id='table_P' style='display:none'>";

我通过以下 javascript 函数在页面上切换:函数toggleTables(table_id)

{
    if(table_id == "table_L") {
        document.getElementById('table_L').style.display = "table";
        document.getElementById('table_P').style.display = "none";
        }
    else if(table_id == "table_P") {
        document.getElementById('table_P').style.display = "table";
        document.getElementById('table_L').style.display = "none";
    }
}

因此，根据用户单击的链接，它会显示相应的表格。但后来我有一个基于所选值的表单，在提交时提供表数据。问题是，如果用户选择默认隐藏的 table_P，然后选择一些下拉值并提交表单，则页面刷新并再次加载 table_L。即使在页面重新加载后，如何保持选择同一个表？提交表单时是否需要存储一些值以记住？

<form method="post" action="">
selections...

<INPUT TYPE="submit" name="submit" title="Run It!" value="SUBMIT" />
</form>

Answer 1

您可以在表单中设置一个隐藏字段，该字段知道哪个表当前可见。提交时，使用客户端的表单数据来回显正确的表。

因此您的表单将如下所示:

<form method="post" action="">
  ...
  <input type="hidden" name="tableid" value="table_P">
  <button type="submit">Submit</button>
</form>

在服务器端，帖子正文将包含表的名称，您将打印正确的表。