jquery-php 魔术：如何从主页循环中打开帖子页面答案

【问题标题】：jquery-php magic: how to open the post page from within a homepage loop fancyboxjquery-php 魔术：如何从主页循环中打开帖子页面
【发布时间】：2016-01-16 12:49:55
【问题描述】：

我在 wordpress 中运行了一个自定义的幻想框；主页循环是“特色图片”的网格；点击它们不会打开一个帖子页面，而是一个带有帖子图像的精美框（通常只有一个）。

这是通过将the_permalink 替换为获取帖子中（第一张）图片的直接网址的php 函数来完成的。到目前为止一切顺利。

现在图片已经在fancybox中打开了；在这里，我已经添加了一个精美的“打印”链接；我需要的是一个链接到我从中获取该图像的实际帖子页面！！

这对我的大脑来说太难了......

...如何通知Fancybox这样的变量？？

很明显，告诉fancybox 使用<?php get_the_permalink(); ?> 是行不通的（php sn-p 将被转换为url 字符；另外，它会知道postID 吗？我怀疑）；

我尝试了在这个网站上找到的不同的 ajax 变体来实现类似的目的，但我无法让它们中的任何一个工作。我不认为我在正确的轨道上。

方法是什么？当用户点击主页上的 fancybox 链接时，图片 url 应该连同（例如）帖子 ID 或帖子永久链接一起发送到 fancybox 脚本中，以允许 fancybox 使用这些变量来生成链接。

此时，绑定到单击操作的简单window.location.replace(permalink); 将起作用。但是我的大脑看不到如何将永久链接或 id 传递给fancybox。 :(

抱歉，缺少代码，我会发布您认为可以提供帮助的任何内容。

（n.b.：我使用的是 fancybox 1.3.7；它是定制的，只是它有一个打印按钮和几乎没有类似的变化，没什么大不了的）

【问题讨论】：

你能告诉我们你是如何添加打印链接并展示fancybox的吗？好吧，显然有一种方法可以显示指向实际帖子页面的打印链接，但我不知道如何在没有看到任何代码的情况下。显而易见的方法是将帖子 ID 添加到循环中的每个图像，并在打开 fancybox 时使用该 ID。但是如果不知道你现在用什么方法来弹出花式框，我就不能给你看一个例子。

标签： php jquery wordpress

【解决方案1】：

很抱歉回答我自己的答案——我是新手 :) 无论如何它是 ...通过写上面的帖子，我实际上帮助我的大脑想出了一个解决方案，这很简单：

fancybox 使用了很多变量，而不仅仅是href；我将使用其中一个来传递永久链接，例如title，甚至添加一个新变量（添加自定义变量将发生在fancybox脚本的顶部，完成此操作：

_start = function() {
        var obj = selectedArray[ selectedIndex ],
            href, 
            type, 
            title,
            str,
            emb,
            ret;

        _abort();

但我现在不想这样做）。

所以我会有这样的情况，在 php 方面：

<a class="fancybox-image" title="<?php echo get_the_permalink(); ?>"    href="<?php echo just_the_image(); ?>">

（如上所述，函数just_the_image正在拍摄帖子的第一张图片）

然后在 jquery 方面，在 fancybox 脚本中，我会这样做（希望这也能回答 Erik 的请求）：

outer.append(permabox = $('<div id="#permabox"></div>'));

接下来几行，我将此操作绑定到“permabox”事物：

$('#permabox').bind("click", function(){
var mytitle = $('#fancybox-title-over').prop('innerHTML');
window.location.replace(mytitle);});

（请注意，为了获取标题作为字符串，我使用了 fancybox 的 innerHTML；不是我认为的最直接的方式）；

上面不是最好的解决方案，因为fancybox有在图片下方显示标题的习惯；如上所述，为此目的添加一个自定义变量会更好——但关键是，上述方法有效:)

【讨论】：