Cycle2 初始化事件未触发

Question

我将 Cycle2 用于基本轮播。我的幻灯片项目有时在其数据中有一个 url，所以我必须使用 Cycle2 api 事件来使用该 url。

我的问题是，虽然 'cycle-after' 事件触发正常，但初始化事件都不会触发。因此，如果我的第一张幻灯片有 url，则什么也不会发生。这是我的代码：

pressSlideshow.on({
'cycle-post-initialize': function(event) {
    console.log('call');
    var a = $('img.cycle-slide-active');
    var d = a.data('url');
    if (d !== undefined) {
        pressLink.attr('href', a.data('url')).show();
    } else {
        pressLink.hide();
    }
},
'cycle-after': function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
    var a = $(incomingSlideEl);
    var d = a.data('url');
    if (d !== undefined) {
        pressLink.attr('href', a.data('url')).show();
    } else {
        pressLink.hide();
    }
}
});

第一个事件永远不会触发，但是当我滚动幻灯片时，'cycle-after' 事件可以正常工作。我还尝试了从未触发的“循环初始化”事件，以及仅在滚动后触发但不在初始化时触发的“循环更新视图”事件。

什么给了？ & thnx 提前:}

Cycle2 Events Documentation

Answer 1

我也遇到了同样的问题。

来自FAQ

为什么不触发循环初始化事件？

确实如此，我保证。但 如果您在事件侦听器已经触发后绑定它，那么您 不会听到的。仔细检查您是否绑定太晚。

您必须在运行 cycle() init 方法之前绑定事件。

假设您将代码设置为：

var pressSlideshow = $('.pressSlideshow').cycle();

pressSlideshow.on({
'cycle-post-initialize': function(event) {
    console.log('call');
    var a = $('img.cycle-slide-active');
    var d = a.data('url');
    if (d !== undefined) {
        pressLink.attr('href', a.data('url')).show();
    } else {
        pressLink.hide();
    }
},
'cycle-after': function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
    var a = $(incomingSlideEl);
    var d = a.data('url');
    if (d !== undefined) {
        pressLink.attr('href', a.data('url')).show();
    } else {
        pressLink.hide();
    }
}
});

改为这样做：

$(document).on('cycle-post-initialize', '.pressSlideshow', function(){
    console.log('call');
    var a = $('img.cycle-slide-active');
    var d = a.data('url');
    if (d !== undefined) {
        pressLink.attr('href', a.data('url')).show();
    } else {
        pressLink.hide();
    }
});

var pressSlideshow = $('.pressSlideshow').cycle();

pressSlideshow.on({
    'cycle-after': function(event, optionHash, outgoingSlideEl, incomingSlideEl, forwardFlag) {
        var a = $(incomingSlideEl);
        var d = a.data('url');
        if (d !== undefined) {
            pressLink.attr('href', a.data('url')).show();
        } else {
            pressLink.hide();
        }
    }
});

注意.pressSlideshow 选择器，因为您的选择器可能会有所不同。

干杯