Question

我需要Magnific-popup才能仅绑定到HTML中的某些链接。因此，当单击一个链接时，它将链接到另一个网站。如果单击另一个链接，它将放大图像。

现在，正在单击的链接（未包装在弹出窗口中的图像中）将被初始化。

这是HTML

<div class="field__item">
    <div class="mfp-field mfp-separate-item">
      <a href="path-to-origin-image">
        <!-- This link is being added to the popup and works correctly-->
        <img class="mfp-thumbnail" src="img-url" />
      </a>
    </div>
    <div class="field--name-field-url">
      <!-- This link is being added to the popup and should be ignored -->
      <a href="https://google.com">Google</a>
    </div>
</div>

这是jQuery

 $(context).find('.field--name-field-gallery-items').once('mfp-processed').each( function() {
        $(this).magnificPopup({
          delegate: 'a',
          type: 'image',
          gallery: {
            enabled: true
          },
          image: {
            titleSrc: function (item) {
              return item.img.attr('alt') || '';
            }
          }
        });
      });

      $(context).find('.field--name-field-gallery-items .field--name-field-url a').each().unbind('click');

如何停止magnificPopup绑定到第二个链接？

Answer 1

解决方案如下：

$(context).find('.field--name-field-gallery-items').once('mfp-processed').each( function() {
        $(this).magnificPopup({
          delegate: '.mfp-field a',
          type: 'image',
          gallery: {
            enabled: true
          },
          image: {
            titleSrc: function (item) {
              return item.img.attr('alt') || '';
            }
          }
        });
      });

我应该已经正确阅读了api

忽略html magnific-popup中的某些链接

1 个答案: