【问题标题】:Magnific Popup: source title from spanMagnific Popup:来自 span 的源标题
【发布时间】:2013-10-16 12:43:30
【问题描述】:

我想从锚标签内的隐藏标题字段中获取我的 Magnific 图像的标题,而不是标题。这是因为我的标题包含标记。

HTML

<a href="img/zoom.jpg">
  <img src="img/small.jpg" alt=""> 
  <span class="hide">This is a caption with <a href="#">a link</a> in it</span>
</a>

JS

// initialise the magnific lightbox
    $('.js-lightbox').each(function() {
      $(this).magnificPopup({
        delegate: 'a',
        type: 'image',
        tLoading: 'Loading image #%curr%...',
        gallery: {
          enabled: true,
          navigateByImgClick: true,
          preload: [0,1] // Will preload 0 - before current, and 1 after the current image
        },
        image: {
          titleSrc: function(item) {
            return item.el.text;
          },
          tError: '<a href="%url%">The image #%curr%</a> could not be loaded.'
        }
      });
    });

显然return item.el.text; 没有按预期工作。谢谢。

【问题讨论】:

    标签: javascript magnific-popup


    【解决方案1】:
    return item.el.find('span').text();
    

    【讨论】:

    • 啊,伙计,我确定我试过了。如此明显 - 但无论如何谢谢!
    【解决方案2】:

    谢谢。事实证明这对我很有用。我无法让它像示例一样工作 - 问题在于将 href 放在 span 元素中。这会导致嵌套的 a 标签在 HTML 中是非法的。下面这个 W3C 文档与 HTML 4 相关,但我相信这同样适用于 HTML 5。

    http://www.w3.org/TR/html401/struct/links.html#h-12.2.2

    【讨论】:

    • href是anchor的一个属性,所以它与父span无关,也不会产生嵌套anchors。
    • 我同意 href 与 span 元素无关,但在您的 html 上方的锚点对我来说似乎是嵌套的。当我在 Firefox 中运行它时,标题在锚元素的开头被截断。 Firebug 报告了一个错误,指出锚被非法嵌套。如果你设法让它正常工作,我需要检查我的代码。
    • 道歉 - 你说的很对。我试图找到我在哪里实现它,但找不到——所以我很可能没有让它与那个标记一起正常工作。这个问题更多是关于尝试从锚标题以外的地方获取标题。但是,正如您所说,如何在放大标题中显示链接的问题仍然存在。也许是一个新问题。
    • 感谢您的回复。分手后要往前看了。编码愉快!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-12-08
    相关资源
    最近更新 更多