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

Question

我正在尝试使用javascript来控制下一个和上一个按钮，这些按钮可以循环访问数据库中的教授列表。我的代码除了一个奇怪的小故障外：当有超过9位教授（这个例子中将有11位教授），单击Prof2上的“previou”按钮同时显示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

有一点很突出的是匹配的使用会匹配正则表达式，并会导致您描述的行为。这应该改变平等。

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

应该

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

可能有其他事情也是如此。

Answer 2

不知道这是否会解决您的问题，但也有一眼看上去有点嫌疑人对我有两件事情：

1. 你为什么由2递减？
2. 您正在检查是否$.vars.counter == 1或$.vars.counter < 0。如果$.vars.counter == 0会发生什么情况？

编辑：

另外，你的上/下一个逻辑有点奇怪（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; 
}