在 fotorama img 标签中添加额外数据答案

【问题标题】：adding extra data into fotorama img tag在 fotorama img 标签中添加额外数据
【发布时间】：2016-01-28 22:35:19
【问题描述】：

我使用http://fotorama.io/ 显示画廊，带有缩略图选项。我想在 img 标签中添加一些额外的数据，但 fotorama 似乎将其删除。这是我的代码：

  <div class="fotorama"
       data-nav="thumbs"
       data-allowfullscreen="native"
       data-thumbwidth="150"
       data-thumbheight="118"
       data-thumbmargin="20"
       >
    {{#photos}}
      <a href="{{url}}" data-thumb="{{thumbnail}}" data-extradata="{{somedata}}"></a>
    {{/photos}}
  </div>

{{#photos}}{{/photos}} 只是 Handlebars.js 循环。

任何建议我如何将一些数据添加到图像中，以便以后从 javascript 访问它？

【问题讨论】：

标签： javascript html fotorama

【解决方案1】：

有一个事件表明 fotorama 已准备就绪。回调方法有第二个参数，其中有一个带有数据的对象：

$('.fotorama').on('fotorama:ready', function (e, fotorama, extra){
  console.log(fotorama.data[index].extradata);
});

PD：为固定括号编辑

【讨论】：