8

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

我的问题是，虽然“循环后”事件触发良好，但初始化事件都不会触发。因此，如果我的第一张幻灯片有 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 活动文档

4

1 回答 1

20

我刚遇到同样的问题。

来自常见问题

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

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

您必须在运行 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选择器，因为您的选择器可能会有所不同。

干杯

于 2013-05-29T11:21:46.237 回答