Question

当我点击同一个php页面中的按钮时，我想显示一个数据表。该按钮用于包含其他输入的表单，例如某些文本。默认情况下，数据表是隐藏的。它从表单中获取值，然后在数据库中进行查询并将其显示在其中。

如何实现显示/隐藏功能？

你有解决方案吗？

感谢。

Answer 1

它是一个简单的ajax问题，你可以使用任何流行的java脚本库来实现这个功能来执行ajax调用和show / hide表。例如，您可以使用jquery的ajax功能从服务器获取数据然后使用jquery的内置效果来显示div中包含的表。例如，要在div“mydiv”中显示内容，只需编写即可 $("#mydiv").show();要隐藏内容，请写下$("#mydiv").hide();

Answer 2

如果您对使用Javascript感到满意，请为table标记添加id属性。然后，在按钮上发生onclick事件，将table的CSS更改为display:none。更改按钮的Javascript以便下次单击它时，它会将table CSS切换为display:table。您也可以使用Javascript库（例如Prototype）来执行此操作。

<table id="myTable">
</table>

<input id="toggleButton" type="button" onclick="hideTable(true);" value="Toggle Table" />

Javascript可能是：

function toggleDisplay(var hide) {
  if (hide) {
    document.getElementById('myTable').style.display = "none";
    document.getElementById('toggleButton').onclick = hideTable(false);
  } else {
    document.getElementById('myTable').style.display = "table";
    document.getElementById('toggleButton').onclick = hideTable(true);
  }
}

把那个Javascript带上一粒盐;我有一段时间没有写过。

如果您不想使用Javascript，请让按钮提交常规HTML表单。在表单中传递一些输入名称，例如hide_table，其值为true。在服务器上，如果$_POST['hide_table'] == "true"，则不允许将表作为HTML输出到页面。此外，切换表单，以便点击该按钮将提交值为hide_table的{{1}}。

false

如果您想使用AJAX仅在用户决定显示表内容时加载表内容，那么优雅地降低表格内容会很好。如果用户没有启用Javascript，表单应该实际提交到服务器并重新加载页面，切换表格显示。但是，如果用户确实启用了Javascript，则可以进行AJAX调用，加载表并将其显示在原位。

Answer 3

假设你想要做这个客户端（即所有数据都是在页面加载时发送到客户端）所有你需要做的就是:(为了简洁而完成原型）

...
<input type="button" id="showTableBtn" value="Show Table">
<table id="dataTable">
    ...
</table>

<script type="text/javascript">
<!--
Event.observe($("showTableBtn"), "click", toggleTable);

function toggleTable() {
    if ($("showTableBtn").value == "Show Table") {
         $("dataTable").show();
         $("showTableBtn").value = "Hide Table";
    } else {
         $("dataTable").hide();
         $("showTableBtn").value = "Show Table");
    }
}

//-->
</script>
...

使用php页面中的按钮显示/隐藏表格

3 个答案: