在許多網(wǎng)頁(yè)中，當(dāng)頁(yè)面內(nèi)容較長(zhǎng)時(shí)，我們會(huì)發(fā)現(xiàn)瀏覽器的滾動(dòng)條無(wú)法到達(dá)頂部，因此需要手動(dòng)拖動(dòng)滾動(dòng)條，這給用戶帶來(lái)了不便。不過(guò)，使用jQuery可以通過(guò)一些簡(jiǎn)單的代碼來(lái)實(shí)現(xiàn)滾動(dòng)條自動(dòng)置頂。

$(window).scroll(function() {
var scrollVal = $(this).scrollTop();
if(scrollVal > 0) {
$('html, body').animate({scrollTop: 0}, 500);
}
});

上述代碼使用了jQuery的scroll事件。當(dāng)滾動(dòng)條滾動(dòng)時(shí)，會(huì)通過(guò)$(window).scrollTop()獲取當(dāng)前的滾動(dòng)值，如果滾動(dòng)值大于0，即不在頁(yè)面頂部，會(huì)使用animate()函數(shù)將scrollTop屬性設(shè)置為0，從而實(shí)現(xiàn)滾動(dòng)條自動(dòng)置頂。animate()函數(shù)中的500表示動(dòng)畫持續(xù)時(shí)間為0.5秒，可以根據(jù)需要自己進(jìn)行設(shè)置。

需要注意的是，如果頁(yè)面中存在其他擁有滾動(dòng)條的元素，如div等，需要使用這些元素的scrollTop屬性來(lái)實(shí)現(xiàn)滾動(dòng)條置頂。

$('#myDiv').scroll(function() {
var scrollVal = $(this).scrollTop();
if(scrollVal > 0) {
$(this).animate({scrollTop: 0}, 500);
}
});

上述代碼中，#myDiv是一個(gè)擁有滾動(dòng)條的div元素，$(this).scrollTop()獲取的是該元素的滾動(dòng)值，$(this).animate()將scrollTop屬性設(shè)置為0，實(shí)現(xiàn)了滾動(dòng)條自動(dòng)置頂。