Question

我有一个<select>，每个选项都会将图片加载到div中。 ajax图像加载器的输出是

<a class="fancybox" href="/useruploads/types/4.jpg" title="Columnlist #1">
    <img style="max-width:300px" src="/useruploads/types/4.jpg" alt="Columnlist #1">
</a>
<h6>Columnlist #1</h6>

这会插入到<div class="thumbnail"></div>

中

所以我尝试使用以下javascript

$('body').delegate('a.fancybox', 'click', function() {
    $(this).fancybox();
    console.log($(this));
    return false;
});

然后记录<a>元素，但图像没有得到fancyboxes（当我删除返回false时，加载的url）

我添加了jquery（1.9.1），fancybox javascript（2.1.5）和fancybox css，所有文件都可以很好地加载到浏览器中。

控制台没有错误。

[编辑] 我已经改为Highslide，现在它完美无缺

Answer 1

从jQuery 1.7开始，.delegate()已被.on（）方法取代。然而，对于早期版本，它仍然是最有效的手段使用事件委托。

使用.on()

语法

$( elements ).on( events, selector, data, handler );

您的代码变为

$('body').on('click','a.fancybox' ,function() {
    $(this).fancybox();
    console.log($(this));
    return false;
});

用ajax加载的Fancybox图像

1 个答案: