从数据库填充的Javascript prev/next按钮

Question

我正在尝试使用javascript实现下一步和上一步按钮，在数据库中循环显示教授列表。我的代码工作正常，除了一个奇怪的故障:当有超过9个教授时(在这个例子中，将有11个教授)，在Prof2上单击“上一步”按钮，同时显示Prof1，Prof10和Prof11。

类似地，在最后一个教授上单击“下一步”，就像本例中的Prof11一样，同时显示Prof1、Prof10和Prof11。你能找出错误吗？有没有更简单的方法来创建这些按钮？提前谢谢你。

$.vars = {
counter : 2,
limit : $getUnitFacultyPages.TotalItems,

};

function nextItem() {
$('li','#profs')
.fadeOut('slow')
.filter( function() { return this.id.match('profs' + $.vars.counter); })
.fadeIn('slow');
$.vars.counter == $.vars.limit? $.vars.counter = 1 : $.vars.counter++; 
}

function prevItem() {
$.vars.counter -= 2;

if($.vars.counter == 1){ 
    $.vars.counter = $.vars.limit;
} else if ($.vars.counter < 0){
    $.vars.counter = $.vars.limit -1;
}

nextItem();
}

$("#profs-next").click(function () {
nextItem();
});

$("#profs-prev").click(function () {
prevItem();
});

Answer 1

最突出的一件事是使用match，它将“匹配”正则表达式，并导致您所描述的行为。这应该改成等价性。

return this.id.match('profs' + $.vars.counter);

应该是

return this.id == 'profs' + $.vars.counter;

也可能有其他的事情。

Answer 2

我不确定这是否能解决你的问题，但有几件事我看起来有点可疑：

你为什么要减去2？，，

• ，

• ，你在检查$.vars.counter == 1还是$.vars.counter < 0。如果使用$.vars.counter == 0

，会发生什么

编辑：

此外，您的prev/next逻辑有点奇怪(imo)。忽略您的显示逻辑，我可能会将其更改为：

$.vars = {
idx: 0,
limit: 5,
};

function nextItem()
{
    $.vars.idx = $.vars.idx >= $.vars.limit ? 0 : ++$.vars.idx;
}

function prevItem()
{
    $.vars.idx = $.vars.idx <= 0 ? $.vars.limit : --$.vars.idx;
}