无法加载 FancyBox 请求的内容。使用车把答案

【问题标题】：FancyBox requested content cannot be loaded. Using handlebars无法加载 FancyBox 请求的内容。使用车把
【发布时间】：2017-04-08 07:51:04
【问题描述】：

我正在尝试将一些文本从一个 div 加载到一个花式框中，当我手动命名 div 时这很好用，例如

<a class='fancybox' href="#inline">Lightbox</a>
<div id='inline' style="display: none;">test</div>

但是，当 id 使用句柄命名时，

<a class='fancybox' href="#{{this}}">Lightbox</a>
<div id='{{this}}' style='display: none;'>test</div>

我得到了错误

"请求的内容无法加载。请稍后再试。”

查看开发者工具，我可以看到 id 是相同的

Screenshot from developer tools

我使用下面的代码来加载 FancyBox

$(document).ready(function() {
  $(".fancybox").fancybox({
		fitToView	: false,
		autoSize	: true,
		closeClick	: false,
		openEffect	: 'none',
		closeEffect	: 'none',
		type        : 'inline',
	});
});

【问题讨论】：

你可以使用“Media-Ninja”而不是“Media Ninja”吗？你知道你有两个不同的 id。
@S.Gholizadeh 在名称中添加破折号效果很好，谢谢。我完全忘记了 id 中不能有空格

标签： javascript jquery html handlebars.js fancybox-2

【解决方案1】：

根据屏幕截图并解决此问题：

<a class="fancybox" href="#Media Ninja">...</a>
<div id="Media Ninja" style="display: none;">

应该是：

<a class="fancybox" href="#Media-Ninja">...</a>
<div id="Media-Ninja" style="display: none;">

这意味着您应该检查 id 变量是否为指向特定 div 标签的特定 id。

【讨论】：