從數據庫填充的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; 
}