featherlight.js tgetAttr 和自动启动功能答案

【问题标题】：featherlight.js tagetAttr and autostart functionfeatherlight.js tgetAttr 和自动启动功能
【发布时间】：2015-03-08 18:07:37
【问题描述】：

我想知道默认配置对象的以下属性的用途。根据 github 上的文档：

默认情况下，Featherlight 在文档就绪时初始化所有匹配 defaults.selector 的元素。如果您想防止这种情况发生，请在 DOM 准备好之前将 $.featherlight.defaults.autostart 设置为 false。

在“绑定羽化部分”下：

然后它将在此元素上查找 targetAttr（默认为“data-featherlight”）并使用其值来查找当您单击该元素时将作为灯箱打开的内容。

给出以上两个，我正在尝试：

所以我做了以下事情：

在我的 javascript 中，在 onReady() 函数之前，我添加了：

$.featherlight.defaults.autostart=false;

和

$.featherlight.defaults.targetAttr='data-my-lightbox';

但是，将自动启动设置为 false 似乎没有任何效果。如果我查看源代码，我也看不到任何对它的引用。不过有一个“autoBind”变量。

接下来，我尝试在锚标签上设置 data-my-lightbox 属性：

<a href="#" data-my-lightbox="my-image-gallery.html" ...>

也试过了：

<a href="my-image-gallery.html" data-my-lightbox="iframe" ...>

但似乎这也被忽略了。直到我做了以下事情：

$('[data-my-lightbox]').featherlight();

以一种看起来合乎逻辑的方式，但我的印象是，如果我在 onReady 之前更改默认属性，其余的就会到位。然后我发现了 autoBind 变量（在 onReady() 之前）：

$.featherlight.autoBind='[data-my-lightbox]';
$.featherlight.defaults.targetAttr='data-my-lightbox';

无需显式 $(..).featherlight 构造即可工作。到目前为止一切顺利。

但是，iFrame 的宽度/高度属性似乎仍应为 data-featherlight-xxxxx 而不是 data-my-lightbox-xxxx..可能归因于源代码中的以下行：

var match = this.name.match(/^data-featherlight-(.*)/);

如果我把它改成这样会怎样：

var matchRegEx = RegExp("^"+targetAttr+"-(.*)"); 
var match = this.name.

并更新相关地方的代码？

感谢您的帮助和帮助。

【问题讨论】：

【解决方案1】：

updated README 反映了人们应该使用 autoBind 这一事实，正如您所发现的那样。

在最新版本中，除了autoBind 和targetAttr 之外，您还需要更改namespace 选项才能获得所需的结果。

【讨论】：