如何从加载的内容中调用 jquery lightBox答案

【问题标题】：How to call jquery lightBox from loaded content如何从加载的内容中调用 jquery lightBox
【发布时间】：2012-08-16 18:16:32
【问题描述】：

我正在尝试使用 jquery lightbox 来显示使用 load() 加载到页面中的照片。我的代码是：

$('#content').on('click', 'a.thumb_link', function(){        
    $('a.thumb_link').lightBox();
    return false;
});

这只有在我点击链接两次时才有效。

【问题讨论】：

您发布的代码中没有任何内容表明需要单击两次。请设置一个 JS Fiddle 来说明问题。
你在使用Lightbox 2吗？或者哪个插件？
2次点击，一键功能，有意义。

标签： jquery image load loaded

【解决方案1】：

你不能做类似的事情

$('#content').live('click', function()
{
   $('a.thumb_link').lightBox();
   return false;
}

如果我有更多代码作为示例，我可能能够提供更好的解决方案，但我只能在假设内容是什么的情况下抓住稻草，指向 thumb_link 类的链接

【讨论】：

一个你必须将你放在 cmets 中的代码封装在后面的那个在转义键下面的那个左边的键上打勾（至少在美国键盘上）。 2，您可以“编辑”您的原始帖子以在这样的场景中添加额外的反馈，以便更容易阅读:-)

【解决方案2】：

这是我的完整代码：

加载的.php

<a class="thumb_link" href="../members/21000_21999/21659/21659-1.jpg">
<img src="../members/21000_21999/21659/21659-1.jpg"></a>

<a class="thumb_link" href="../members/21000_21999/21659/21659-3.jpg">
<img src="../members/21000_21999/21659/21659-3.jpg"></a>

test.php

<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Test</title>
<link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css"        media="screen" />
<script src="js/jquery.js"></script>
<script src="js/jquery.lightbox-0.5.js"></script>

<body>
<a class="link" href="../members/21000_21999/21659/21659-1.jpg">
<img src="../members/21000_21999/21659/21659-1.jpg">
</a>

<a class="link" href="../members/21000_21999/21659/21659-3.jpg">
<img src="../members/21000_21999/21659/21659-3.jpg">
</a>

<div id="content"></div>
<script>
$(document).ready(function(){

    $('a.link').lightBox();

    $('#content').load('loaded.php');

    $('#content').on('click', 'a.thumb_link', function(){        
        $('a.thumb_link').lightBox();
        return false;
    }); 


});
</script>
</body>
</html>

直接在 test.php 中编码的前 2 个图像将通过单击图像运行 lightBox。底部 2 个加载的图像只有在我单击两次时才会运行 lightBox。

或者，如果我先单击顶部图像，然后单击加载的图像（仍然单击两次），加载的图像将运行 lightBox

我正在使用： jQuery v1.7.1 jquery lightBox v0.5

【讨论】：

【解决方案3】：

我很困惑，为什么提供的 2 个答案不起作用？

最后，我设法通过将我的 JS 包含在加载的页面中来使其工作，以便脚本与其他内容一起加载到页面中。

这成功了：

$('a.thumb_link').lightBox();

【讨论】：