點擊下一頁或上一頁讓頁面滾動

Question

首先請親臨此小提琴：http://jsfiddle.net/XvAR6/

現在向下滾動以查看。

在這裏我已經使用jQuery ui。但是，這不是問題，主要問題是當我點擊下一頁或上一頁時，頁面自動滾動到頂部。我不想滾動。我可以爲它獲得解決方案嗎？

這裏是jQuery代碼：

$("#tab1, #tab2").tabs({active: 1}); 

var all = $('.udtalelse').addClass("passiv"); 

var i = -1; 

$('#prev').click(function() { 
    ctrlKunder(i = !i ? all.length - 1 : --i); 
}); 
$('#next').click(function() { 
    ctrlKunder(i = ++i % all.length); 
}).click(); 

function ctrlKunder(ele) { 
    all.removeClass("active").addClass("passiv"); 
    all.eq(ele).removeClass("passiv").addClass("active"); 
} 

謝謝。

Answer 1

你的錨標記有#一個href，因此被點擊時，頁面的哈希值更新爲#導致滾動到頂部。防止默認操作使其停止。

$('#prev').click(function(e) { 
    e.preventDefault(); 
    ... 

Answer 2

在click的callback function中添加對event的引用。我們在這裏用變量e來引用它。然後使用e.preventDefault();停止默認頁面跳轉。

$('#prev').click(function(e) { 
    e.preventDefault(); // add this 
    ctrlKunder(i = !i ? all.length - 1 : --i); 
}); 
$('#next').click(function(e) { 
    e.preventDefault(); // add this 
    ctrlKunder(i = ++i % all.length); 
}).click(); 

Answer 3

您可以使用event.preventDefault()或return false;這裏：

$('#prev').click(function(e) { 
    e.preventDefault(); // return false; 
    ctrlKunder(i = !i ? all.length - 1 : --i); 
}); 
$('#next').click(function() { 
    e.preventDefault(); // return false; 
    ctrlKunder(i = ++i % all.length); 
}).click(); 

可以使用return false;了。 return false;也會停止事件冒泡。

---

從文檔：

說明：

如果此方法被調用時，事件的默認動作不會被觸發。

Answer 4

你有兩種選擇。

更改href的下一個/上鍊接javascript:; OR

更改點擊事件：

$('#prev').click(function(e) { 
    ctrlKunder(i = !i ? all.length - 1 : --i); 
    e.preventDefault(); 
}); 

$('#next').click(function(e) { 
    ctrlKunder(i = ++i % all.length); 
    e.preventDefault(); 
}).click();