在按钮上单击引用不同的 html 文件答案

【问题标题】：On Button Click Reference a Different html file在按钮上单击引用不同的 html 文件
【发布时间】：2012-08-16 21:37:48
【问题描述】：

我一直在寻找几个小时，可能是因为我有限的 Java 知识，我有点卡住了..

我正在开发一个网站，我想让事情变得尽可能容易改变。我希望用户加载主页，然后通过点击不同的按钮，页面的html“主要内容”会相应改变。

我这样做的原因是我想让一切都真正干净和简单，这样如果我想更新索引页面的格式，我只需要更新一个页面..

我假设我需要 java 来解决这个问题..

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Prodigy Doo Design</title>
<link href="template/style.css" rel="stylesheet" type="text/css" />
</head>

<body>


<?php include('template/header.php'); ?>
<div class="pad50px900wide"><!--Padding after headder--></div>
<?php include('template/nav.php'); ?>

<!--*****************************
********* BODY CONTENT***********
******************************-->
<div class="bodyContent"><?php include('text.html'); ?></div>
<!--*****************************
******END OF BODY CONTENT********
******************************-->

<?php include('template/footer.php'); ?>

</body>

被“BODY CONTENT”大量表示的部分是我想要改变的部分。我想我可以以某种方式说：

如果单击主页按钮 -> 包含 'home.html'

如果关于按钮点击 -> 包括'about.html' ... ...

我只是不知道如何将其放入代码中..

您可以在http://pddtest.webuda.com/ 处查看我目前所获得的内容（如果您不知道，当您在大多数浏览器中显示该站点的源代码时，它会加载参考文件，就好像它们一开始就在一起一样地方，所以可能更容易理解我想要做什么）

对不起，如果我有点含糊，任何帮助都会非常感激，我已经在互联网上爬了很长时间，我知道这可能相当简单

【问题讨论】：

@HovercraftFullOfEels 我认为他的意思是 Javascript？我会相应地重新标记。顺便说一句，好名字！
是否要在不刷新页面的情况下更新内容？

标签： php html button click

【解决方案1】：

我认为您想要实现的是一个基本模板，其中只有主要内容发生了变化。这意味着编辑基本模板（或页面，如果你想调用它），编辑所有其他页面。

为此，您只需要一些基本的 PHP，您可以在 GET 变量中将文件名与响应一起发送。

<a href="index.php?file=about">About</a>

无论您的包含在哪里，您只需将此变量添加到 php 扩展：

<?php include ($file.".php"); ?>

当然不要忘记检查变量是否在请求中。这是一种非常基础的方式，可能不安全，但它是基础php的一个很好的应用。

希望这会有所帮助。

【讨论】：

是的，一个基本模板正是我想要做的：D .. 我喜欢你所说的，但我不完全确定如何将它整合到我目前所拥有的.. 如果可能的话，你能不能给我一个我如何将它集成到我的代码中的例子？我会告诉你我在做什么，但无论如何我认为它完全错误..
我刚看到你更新的链接，看来你有问题。我假设您正在编写如果你回头看看我的回答，它实际上是不同的，$file 是一个字符串变量，我把它放在一个 GET 变量中，然后像这样的扩展名连接点运算符只不过是 php 中的字符串连接。让我知道会发生什么
我想我在做你说的。我在根目录中创建了 2 个页面，在“正文内容”部分中分别称为 'home.php' 和 'about.php'，我替换了我拥有的代码，并使用了 pastebin.com/f2LNbWnM 你现在可以查看该站点，错误指向第 21 和 22 行，它们是：
如果您想点击它们，链接也位于错误下方。我一定是在做一些明显错误的事情，哈哈
少了一件小事。当您将 GET 变量放入请求中时，您不能通过 $ 运算符（例如 $file）调用它。您必须从请求中检索它并将其存储在一个变量中，如下所示： $filename = $_REQUEST['file'];然后，您将在代码中使用 $filename 变量。检查这个 pastebin 看看我在说什么pastebin.com/Az5Qyghy

【解决方案2】：

您已经有 PHP 包含发生，这意味着您正在减少需要对您的页面进行更新的数量，并且更改页眉、页脚等中的某些内容将改变整个网站。

最好有单独的页面，即 index.php、about.php（您的页面必须是 .php 而不是 .html，因为您在页面中使用 php 来包含）并链接到这些页面只使用常规链接。

这种方法对 SEO 也更好。

如果你真的想按照你最初谈论的方式来做，你可以使用 jQuery load() 方法。

更多信息在这里： http://api.jquery.com/load/

【讨论】：

【解决方案3】：

我认为您需要阅读 javascript、HTML 和 PHP 的基础知识；通过这种方式，您应该能够自己获得它并成为更好的开发人员。

Javascript 是客户端脚本。这意味着您的 javascript 代码由用户的浏览器解释。当某些浏览器以不同方式解释您的 javascript 时，这可能会导致问题。

PHP 是服务器端 脚本。无论您的用户使用什么浏览器浏览，它的行为都是一样的。只要传入相同的数据，函数就会以一致的方式运行。它将 HTML（或其他数据，但更高级）发送到客户端。

HTML 是标记。它所做的只是告诉浏览器如何显示您从服务器返回的数据。

结合这三者，您可以更好地了解它们之间的交互方式。如果页面上的某些内容在后台可以是“动态的”，但是一旦用户查看它是静态的（不变的），请使用 PHP。如果某些内容依赖于用户输入来动态更改而不刷新页面，那么您将需要实现某种 javascript。

【讨论】：

【解决方案4】：

有多种方法可以实现，这里有3种简单的方法，无需重新加载index.html：

使用 iFrame：使 index.html 包含所有按钮和一个名为 PageContent 的 iFrame 在单击每个按钮时调用一个 JS 函数，该函数只需将 PageContent 的 src 属性更改为相关的 html。
使用客户端 JS：使 index.html 包含您所有的按钮。还将所有相关页面的内容包含到隐藏的 DIV 中。单击每个按钮时，将隐藏所有其他“选项 DIVS”并仅显示相关的 DIV。
使用 AJAX：使 index.html 包含所有按钮和一个名为 PageContent 的 DIV 在单击每个按钮时调用一个 JS 函数，该函数只需点击服务器，获取链接到的页面的内容按钮并使用 innerHTML 将其呈现到 DIV 中。

【讨论】：