如果我手动添加一个类而不是jQuery那么Fancybox可以工作.addClass（）

Question

我有以下JS代码，我将Fancybox类添加到页面上的所有href：

$(function(){ 

    //set target var
    var $targetTable = $('.photo-frame a');

    //loop trough each table and insert the fancybox class on the href tag
    $targetTable.each(function() {
        $targetTable.addClass('fancybox');
    });

}); 

这是有效的，因为添加了fancybox类 ，但未触发fancybox。但是，如果我在浏览器编辑器中手动添加此类并单击图像fancybox 被触发。

我也尝试了以下内容，但没有结果：

$('.photo-frame a').addClass('fancybox');

有没有人知道这可能归因于哪里？

Answer 1

当您对类进行硬编码时，它的工作原理是因为它在构建DOM时存在，但与后一种情况不同。

您需要按fancybox

重新初始化$(".fancybox").fancybox();

$(function(){ 

    //set target var
    var $targetTable = $('.photo-frame a');

    //loop trough each table and insert the fancybox class on the href tag
    $targetTable.each(function() {
        $targetTable.addClass('fancybox');
    });

    $(".fancybox").fancybox();

}); 

Answer 2

您的代码+正确的fancybox初始化正常

$(function () {
    // initialize fancybox
    $(".fancybox").fancybox();

    //set target var
    var $targetTable = $('.photo-frame a');
    //loop trough each table and insert the fancybox class on the href tag
    $targetTable.each(function () {
        $targetTable.addClass('fancybox');
    });
});

如void所示，以下内容也适用

$(function () {

    //set target var
    var $targetTable = $('.photo-frame a');
    //loop trough each table and insert the fancybox class on the href tag
    $targetTable.each(function () {
        $targetTable.addClass('fancybox');
    });

    // initialize fancybox
    $(".fancybox").fancybox();
});

根据Jeremy Thille的建议，这也有效

$(function () { 
    $('.photo-frame a').fancybox();

    // initialize fancybox
    $(".fancybox").fancybox();
});

......以任何顺序

$(function () {    
    // initialize fancybox
    $(".fancybox").fancybox();

    $('.photo-frame a').fancybox();
});

所以，我猜？您的代码中的某些内容会触发js错误，导致您的addClass代码和fancybox无法正常工作。

您最好在询问前检查错误。