Heim  >  Artikel  >  Web-Frontend  >  jquery implementiert HTML-Seiten-Div, Fake-Paging hat Prinzip und code_jquery

jquery implementiert HTML-Seiten-Div, Fake-Paging hat Prinzip und code_jquery

WBOY
WBOYOriginal
2016-05-16 16:36:501497Durchsuche

Falsches Paging-Prinzip von div: Die Gesamthöhe des ausgefüllten div (1000 Pixel) und die Anzeigehöhe (100 Pixel), dann beträgt die Gesamtzahl der Seiten 10 Seiten. Beim Betrachten der zweiten Seite liegt die Höhe des angezeigten Divs zwischen 100 und 200 usw.

Wenn man sieht, dass sich die Seite umblättert, bewegt sich tatsächlich die Bildlaufleiste des Div.

<div id="applications">显示数据集合</div>
<style> 
#applications 
{ 
/* width:500px;调整显示区的宽*/ 
height: 1592px; /*调整显示区的高*/ 
font-size: 14px; 
margin-top:23px; 
line-height: 20px; 
overflow-pageindex: hidden; 
overflow-y: hidden; 
word-break: break-all; 
} 
</style>

<script language="javascript"> 
var obj = document.getElementById("applications"); //获取内容层 
var pages = document.getElementById("pages"); //获取翻页层 
window.onload = function ()//重写窗体加载的事件 
{ 
var allpages = Math.ceil(parseInt(obj.scrollHeight) / parseInt(obj.offsetHeight)); //获取页面数量 
// pages.innerHTML = "<b>共" + allpages-1+ "页</b> "; //输出页面数量 
for (var i = 1; i <= allpages; i++) { 
if (i == 1) { 
pages.innerHTML += "<a href=\"javascript:showPage('" + i + "');\">首页</a> "; 
} 
else{ 
pages.innerHTML += "<a href=\"javascript:showPage('" + i + "');\">" + i + "</a> "; 
} 
//循环输出第几页 
} 
} 
function showPage(pageINdex) { 
obj.scrollTop = (pageINdex - 1) * parseInt(obj.offsetHeight); //根据高度,输出指定的页 
} 
</script>

Beim Paging dynamischer Daten reicht die letzte Seite nicht für die Anzahl der Paging-Elemente aus und die spezifische Höhe muss ausgefüllt werden, da sonst die Daten der vorherigen Seite wiederholt auf der letzten Seite angezeigt werden.

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn