1

我正在寻找类似于 php include 方法的解决方案，除了在 html 的 iframe 标记处，如果我单击包含的 php 上的超链接，我不希望浏览器将整个选项卡导航到新的 url，但只有导航包含的页面而不获取父页面更改/消失。

更新：

好的，感谢您的快速回答，似乎我没有问正确的问题:) 所以这里有一些背景信息：整个页面本身是一个单文件网站，使用与您完全相同的 javascript+hiddendivs 页面更改方法刚写的。我的问题是：我正在使用平面文件 CMS 来让没有编码知识的人可以管理我的新闻页面。所以我为CMS制作了一个自己的模板，只显示新闻本身。然后我使用 php include 方法将 CMS 的 index.php 嵌入到我的父 index.php 中，它看起来非常好，除了我的问题是，当我点击“早期帖子”时，它导航到 CMS 的 index.php 并加载早期的新闻那里。我希望它可以加载较早的新闻而无需在任何地方导航，就像在 html 的 iframe 方法中一样。（如果没有其他解决方案，我将使用 iframe，

4

4 回答 4

0

您可能做的最好的事情是使用 jquery/javascript 并操作一个 div（或 iframe）到它在与之交互时导航到 X 链接的位置。您实际上可以使用 jquery 更改 iframe 的 url 并将其重新加载到您想要的任何 url。使用 jQuery 重新加载 iframe就是一个很好的例子。为了与 iframe 的内容进行交互和挖掘，而不仅仅是更改它的属性，请查看http://developer.vimeo.com/player/js-api。

请记住，第二个链接是针对媒体播放器的，但它仍然显示（并且以非常简单的方式）如何与 iframe 进行良好交互。您可以使用 jquery 向最初加载到 iframe 的页面中的链接插入 id 或类，然后让“父页面”上的脚本在单击 iframe 时将其导航到其中一个链接。只是玩弄它并从中获得乐趣；学习经历并不总是像个人地狱一样。我稍后再回来看看结果如何！

于 2013-04-22T21:45:20.803 回答
0

从所描述的操作看来，您正在寻找的实际上不是 PHP，而是客户端 JavaScript。AJAX 可以完全按照您的描述执行，并且有一个名为 jQuery 的非常简单的库可以帮助您以最小的努力做到这一点。

http://api.jquery.com/jQuery.get/ http://api.jquery.com/jQuery.ajax/

您可以将您的按钮绑定到一个 JavaScript 函数，该函数随后可以触发 AJAX，获取您的其他 PHP 页面的结果并在 HTML 中的 .class 或 #id 中显示给用户，而无需离开当前页面。

如果您寻找的行为更高级且“类似于应用程序”，您还可以考虑整个 MVC JavaScript 框架，例如 Backbone.js 或 Ember.js

于 2013-04-22T21:24:42.170 回答
0

为此，您必须了解您正在处理的内容。

加载到用户浏览器中的*.php页面是经过处理和解析的页面。此解析发生在服务器端，并由服务器上的 PHP 处理器处理。现在，在*.php处理文件后，与它的任何交互都会丢失。用户（客户端）唯一看到的是这个处理的结果。因此，要与此页面通信，必须发送信息。

通常，浏览器会发送请求页面的信息。这就是HTTP协议的工作原理。

由于用户是客户端，他必须按照协议的规则发送相关信息（标头、变量等）。这意味着，用户必须请求页面，并通过此请求发送数据。

AJAX 技术允许您在后台动态打开HTTP请求，同时页面仍在运行，无需刷新。它根据协议的约定发送相关数据，并允许您触发回调函数来处理来自服务器的答案。

在这里您可以找到初学者教程，它将为您提供必要的信息以帮助您入门。

附言

我强烈建议你不要在一开始就使用常见的外部库，如 jQuery、node.js、Backbone.js 等。这些库是为简化高级开发人员的代码编写而创建的工具。它们可能会使您感到困惑并弄乱您的编程逻辑和学习路径。

祝你好运！

于 2013-04-22T22:00:45.193 回答
-1

听起来您希望新内容出现在页面上，而不会将用户定向到新页面。您可以使用 jQuery 来实现这一点。这是一个简单的例子。

HTML：

<p>
    <a href="#" id="1">Page 1</a> <a href="#" id="2">Page 2</a> <a href="#" id="3">Page 3</a>
</p>
<div>
    <div id="content1">
        This is page 1.
    </div>
    <div id="content2">
        This is page 2.
    </div>
    <div id="content3">
        This is page 3.
    </div>
</div>

jQuery：

$('#content2, #content3').hide();

$('a').click(function() {
    var id = $(this).attr('id');
    $('#content' + id).show().siblings().hide();
});

现场示例：http: //jsfiddle.net/VxZKs/1

于 2013-04-22T21:27:35.477 回答