jquery - 用 ajax 加载的 Fancybox 图像

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>元素，但图像没有得到花式框（当我删除返回 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;
});