jquery - 使用 jQuery click 更改 OG:IMAGE 的值

Question

我只是用一个 HTML 页面构建了一个图像组合，其中所有图片都是动态加载的。到目前为止，一切都很好，除了 facebook META OG:IMAGE。

由于页面只加载一次，我可以分配一次 OG:IMAGE URL...但我真的希望每张图片都有自己的 OG:IMAGE，因为这是一个相册。

通过单击 --li class="open-pic"-- 标签加载图片。每次单击 --li class="open-pic"-- 标签时，我都想更改 OG:IMAGE 值。

可能吗？我发现了这样的东西：

$('meta[name=og\\:image]').attr('content', newImageUrl);

但是，我不知道如何将其链接到 li.open-pic onclick 事件。谢谢！

G。

Answer 1

由于页面只加载一次，我可以分配一次 OG:IMAGE URL...但我真的希望每张图片都有自己的 OG:IMAGE，因为这是一个相册。

在客户端更改 OG 元标签并没有实际用途——因为 Facebook 会通过它的抓取工具读取这些标签，这意味着它们将对您的 URL 进行 HTTP 请求并查看 HTML 代码中的内容；并且刮板不执行任何 JavaScript。

解决方案：为每张照片提供一个单独的 URL，并提供其自己的元信息——并让您的点赞按钮/分享功能/任何 FB 功能指向每张照片的该 URL。

（你如何处理客户端的事情并不重要——你仍然可以在一个页面中显示所有照片，通过 AJAX 加载新内容，无论你喜欢什么——但你需要单独的 URL 来为你的照片识别为单独的打开图形对象。）

Answer 2

$('li.open-pic').click(function(){
 $('meta[name=og\\:image]').attr('content', newImageUrl);
});

Answer 3

是结肠。尝试像这样使用单引号和双引号：

var imgSrc = $(this).find('img').attr('src'); // image stored as variable
$('meta[property="og:image"]').attr('content', imgSrc); // assigns meta property