Question

我有一个很长的列表，我想使用jQuery Cycle'分页'。列表中大约有40个项目，我想一次显示5个项目，底部有Next / Prev。

这就是我要做的事：http://jsfiddle.net/saltcod/vmdaM/97/

第一个函数将列表分成5个项目的块，然后jQuery Cycle将在结果上运行。

我已经把这个列表分成5个项目就好了。但jQuery Cycle一直告诉我它没有任何div可以使用。

如何在jQuery Cycle启动之前确保第一个函数完全切片列表？

由于

特里

Answer 1

实际上，正如@minitech所提到的那样，在循环插件初始化时，for循环可以保证完成。

问题是你的选择器：

$('#projectList').cycle(...)

projectList元素中没有任何div，只有一个ul。

更改您的选择器：

$('#projectList ul').cycle(...)

当然......你的wrapAll电话使得标记不正确。你现在有ul > div > li这几乎肯定是无效的...但是嘿，无论如何都应该有效，至少可以让你更进一步：）

Answer 2

问题是您的<div>仍然嵌套在<ul>中。你需要从那里删除它们。我不知道出了什么问题，我无法让它正常工作。你错过了样式表吗？无论如何，这是我的重写，它使用正确的标记：

var count = 1;
var newList;
var projectList = $('#projectList');

projectList.find('ul').remove().find('li').each(function(i) {
    if(i % 5 === 0) {
        newList = $('<ul>');
        newList.appendTo($('<div>').addClass('panel panel' + count++).appendTo(projectList));
    }

    newList.append(this);
});

projectList.cycle({
    fx: 'scrollVert',
    speed: 'fast',
    timeout: 0,
    prev: '.back',
    next: '.more'
});

Here's a demo.

jQuery - 仅在另一个已完成运行后运行一个函数

2 个答案: