日韩美女视频在线观看,午夜欧美电影,91视频看污

用DevExpress ASP.NET實(shí)現(xiàn)鼠標(biāo)滾動(dòng)自動(dòng)加載內(nèi)容（無限分頁）

原創(chuàng)|其它|編輯：郝浩|2012-05-09 21:16:30.000|閱讀 704 次

概述：現(xiàn)在大數(shù)據(jù)集在網(wǎng)絡(luò)上隨處可見，您可以用以下DevExpress ASP.NET控件實(shí)現(xiàn)無限分頁，實(shí)現(xiàn)鼠標(biāo)滾動(dòng)自動(dòng)加載內(nèi)容，這樣網(wǎng)站性能更高，網(wǎng)站訪問更加流暢。

# 界面/圖表報(bào)表/文檔/IDE等千款熱門軟控件火熱銷售中 >>

先看一下最終效果：

無限分頁 - 用DevExpress ASP.NET實(shí)現(xiàn)鼠標(biāo)滾動(dòng)自動(dòng)加載內(nèi)容

使用實(shí)現(xiàn)上圖效果的方法

您可以用以下控件實(shí)現(xiàn)上圖中的效果：

ASPxCallback
ASPxLoadingPanel
ASPxPanel
ASPxClientUtils對象中的JavaScript方法

你可以到查看代碼：

下面讓我們看看"無限分頁"方案能給我們帶來的好處和一些可能會(huì)遇到的問題。

大型數(shù)據(jù)集

現(xiàn)在大數(shù)據(jù)集在網(wǎng)絡(luò)上隨處可見，一旦用戶需要處理這些一T或更多的信息時(shí)，你該怎么辦呢？你可以將它們分成小塊的數(shù)據(jù)分頁：

無限分頁 - 用DevExpress ASP.NET實(shí)現(xiàn)鼠標(biāo)滾動(dòng)自動(dòng)加載內(nèi)容

無限分頁或無限滾動(dòng)

無限分頁 (或無限滾動(dòng))被許多公司使用，如Facebook、Bing、騰訊、新浪、twitter等。

當(dāng)一個(gè)頁面有大量內(nèi)容提交時(shí)，無限分頁是一個(gè)不錯(cuò)的選擇。一些不需要顯示的數(shù)據(jù)內(nèi)容沒有必要一次性加載和顯示，當(dāng)用戶鼠標(biāo)向下滾動(dòng)時(shí)，再自動(dòng)加載更多的數(shù)據(jù)。（像上面的gif動(dòng)畫顯示的那樣）

為什么用無限分頁？

我建議這種做法，原因有兩個(gè)：

性能 - 當(dāng)你沒有一次性加載數(shù)千行和數(shù)百列數(shù)據(jù)時(shí)，你的網(wǎng)站速度會(huì)更快。
流暢 - 最終用戶可以使用AJAX無縫加載更多信息繼續(xù)他們的體驗(yàn)。

Jeff Atwood有一個(gè)夢幻般的博客文章，標(biāo)題為"分頁的結(jié)束"。我從里面截取了一小段：

在完美世界里，每一個(gè)搜索結(jié)果都在一個(gè)頁面，只有一條記錄并且就是你正想找的。

分頁也是阻力。

我的意思不是說所有的分頁都應(yīng)當(dāng)被無限分頁代替，但是我們作為軟件開發(fā)者，應(yīng)當(dāng)避免產(chǎn)生成千上萬的列表和分頁，這無疑增大了用戶的負(fù)擔(dān)。記住，我們發(fā)明計(jì)算機(jī)是為了使人們的生活更容易，而不是更困難。

Google研究證實(shí)最終用戶通常不喜歡看到所有的數(shù)據(jù)：

用戶測試報(bào)告告訴我們搜索者更喜歡整頁瀏覽、單頁內(nèi)容的版式，而不是只包含部分內(nèi)容和許多分頁符的頁面。

有趣的是，用戶不喜歡整頁瀏覽花長時(shí)間加載（例如，當(dāng)整頁瀏覽加載需要一些時(shí)間時(shí)，用戶認(rèn)為它包含許多圖像）。這是有道理的，因?yàn)槲覀冎溃脩魧徛惶珴M意。所以，整頁瀏覽通常先加載需要顯示的部分。作為一個(gè)站長，重要的是要平衡這種偏好頁面的加載時(shí)間和整體用戶體驗(yàn)。

無限滾動(dòng)也有一些缺點(diǎn)，比如滾動(dòng)條的問題，深層鏈接，后退按鈕的位置，以及其他Jeff的文章（）中提到的問題。

實(shí)驗(yàn)，重復(fù)，實(shí)驗(yàn)...

重復(fù)和測試各種可用性方案是良好用戶界面的關(guān)鍵。我建議你使用DevExpress ASPxCallBack，ASPxLoadingPanel等嘗試無限分頁。無限分頁的功能包含在ASPxGridView中：

你應(yīng)該努力使分頁無關(guān)高于一切，因?yàn)橛脩粲肋h(yuǎn)只會(huì)看到他們需要的那一條內(nèi)容。 -Jeff Atwood

示例代碼

示例代碼中心的操作流程如下：

渲染后，當(dāng)用戶鼠標(biāo)向下滾動(dòng)頁面，我們就處理瀏覽器"滾動(dòng)"事件。
當(dāng)滾動(dòng)到頁面的底部，我們產(chǎn)生一個(gè)回調(diào)（使用ASPxCallback），從服務(wù)器獲得新的數(shù)據(jù)部分。
然后，我們將已收到的內(nèi)容添加到dataContainerElement DIV元素的后面。

出處：

（慧都控件網(wǎng)版權(quán)所有，轉(zhuǎn)載請注明出處，否則追究法律責(zé)任）

標(biāo)簽：HTML5 ASP.NET

本站文章除注明轉(zhuǎn)載外，均為本站原創(chuàng)或翻譯。歡迎任何形式的轉(zhuǎn)載，但請務(wù)必注明出處、不得修改原文相關(guān)鏈接，如果存在內(nèi)容上的異議請郵件反饋至chenjj@fc6vip.cn

文章轉(zhuǎn)載自：

上一篇：Skelta BPM.NET如何通過表達(dá)式編輯器設(shè)置activity優(yōu)先級(jí) 下一篇：甘特圖在SAP Business One中的應(yīng)用