Magnific-Popup：从点击的元素中获取动态内容答案

【问题标题】：Magnific-Popup: Get dynamic content from clicked elementMagnific-Popup：从点击的元素中获取动态内容
【发布时间】：2014-12-15 16:18:52
【问题描述】：

我有一排包含隐藏内容的图块。我正在使用Magnific-Popup 来获取内容并添加到灯箱中，我似乎无法做到这一点，但我一直从所有内容而不是从单击的元素中获取内容。

我的问题是：如何仅从单击的元素中获取内容？

HTML

<div class="tile">
   <div class="mfp-hide tile-info"><p>One</p></div>
</div>

<div class="tile">
    <div class="mfp-hide tile-info"><p>Two</p></div>
</div>

<div class="tile">
    <div class="mfp-hide tile-info"><p>Three</p></div>
</div>

<div class="tile">
    <div class="mfp-hide tile-info"><p>Four</p></div>
</div>

jQuery

$('.tile').magnificPopup({
    items: {
    src: '.tile-info',
    },
    type: 'inline'
});

这是小提琴

http://jsfiddle.net/8csham4u/39/

【问题讨论】：

标签： jquery lightbox magnific-popup

【解决方案1】：

想通了。我的答案

$('.tile').on('click', function () {
  var theGoodStuff = $(this).find('.tile-info p')
  $.magnificPopup.open({
      items: {
          src: theGoodStuff,
      },
      type: 'inline'
  });
});

http://jsfiddle.net/2a6a4gvh/1/

【讨论】：