<%@ Page Language="C#" AutoEventWireup="true" CodeFile="jsfenye.aspx.cs" Inherits="jsfenye" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
#div1
{
width:50%;
height:30%;
background-color:Green;
font-size:20px;
padding-top:10px;
}
#firstpage
{
float:left;
width:5%;
}
#doingpages
{
float:left;
width:auto;
}
#lastpage
{
float:left;
width:5%;
}
</style>
<script type="text/javascript">
var allpagetext; //保存div中的总内容
var mynowindex; //保存当前的页索引
var pagecount; //总页数
function mychar() {
var mydoingdiv = document.getElementById("doingpages");
//当改变每页的字符数时，需要将以前的链接删除
if (mydoingdiv.childNodes.length > 0) {
var myalength=mydoingdiv.childNodes.length;
for (var i = 0; i < myalength; i++) {
var olda = mydoingdiv.getElementsByTagName('a')[i];
if (olda != null) {
olda.parentNode.removeChild(olda); //删除超链接
i--;
}
}
}
var mydiv = document.getElementById("div1");
if (allpagetext != null) {
mydiv.innerText = allpagetext;
}
else {
allpagetext = mydiv.innerText;
}
var pagesize = document.getElementById("text1").value; //看text1要每页显示的字符个数
var totalLength = allpagetext.length; //div1中总共有多少字符
if (parseInt(pagesize) > totalLength) {
alert("超过总字符数，总字符才有" + totalLength + "个字符");
}
else {
//看有多少页数
if (totalLength % parseInt(pagesize) == 0) {
pagecount = totalLength / parseInt(pagesize);
}
else {
pagecount =Math.ceil(totalLength / parseInt(pagesize)); //如果除不尽，则用函数ceil加一页
}
for (var j = 1; j <= pagecount; j++) {
var afirst = document.createElement('a');
afirst.href = "javascript:nowpageindex(" + j + ")";
var atext = document.createTextNode(j);
afirst.appendChild(atext);
document.getElementById("doingpages").appendChild(afirst); //创建超链接显示页数
}
var nowText = mydiv.innerText.substr(0, parseInt(pagesize));//默认显示第一页
mydiv.innerText = nowText;
}
}
//当点击第几页时相应显示那一页的内容的函数代码
function nowpageindex(pageindex) {
var mydiv = document.getElementById("div1");
mynowindex = pageindex;
if (allpagetext != null) {
mydivtext = allpagetext;
}
else {
allpagetext = mydiv.innerText;
}
var mytext1 = document.getElementById("text1").value;
if (mytext1 != null) {
var newindex = parseInt(pageindex-1) * parseInt(mytext1);
mydiv.innerText = allpagetext.substr(newindex, newindex + parseInt(mytext1));
}
}
//上一页代码
function jianpageindex() {
if (mynowindex > 0) {
mynowindex--;
}
var mydiv = document.getElementById("div1");
if (allpagetext != null) {
mydivtext = allpagetext;
}
else {
allpagetext = mydiv.innerText;
}
var mytext1 = document.getElementById("text1").value;
if (mytext1 != null) {
var newindex = parseInt(mynowindex - 1) * parseInt(mytext1);
mydiv.innerText = allpagetext.substr(newindex, newindex + parseInt(mytext1));
}
}
//下一页代码
function addpageindex() {
if (mynowindex < pagecount) {
mynowindex++;
}
var mydiv = document.getElementById("div1");
if (allpagetext != null) {
mydivtext = allpagetext;
}
else {
allpagetext = mydiv.innerText;
}
var mytext1 = document.getElementById("text1").value;
if (mytext1 != null) {
var newindex = parseInt(mynowindex - 1) * parseInt(mytext1);
mydiv.innerText = allpagetext.substr(newindex, newindex + parseInt(mytext1));
}
}
</script>
</head>
<body onload="mychar()">
<form id="form1" runat="server">
<div>
<div id="firstpage">
<a href="javascript:jianpageindex()">上一页</a>
</div>
<div id="doingpages">
</div>
<div id="lastpage">
<a href="javascript:addpageindex()">下一页</a>
</div>
</div>
<div>
<input type="text" id="text1" value="100"/>
<input type="button" value="确定" onclick="mychar()" id="btnok"/>
</div>
<div id="div1">
哈喽,大家好,<br /><br />
听见傍晚，车窗外，未来有一个人在等待，<br /><br />
如果梦想没别大海冷冷拍下，又怎么会晓得哈哈,<br /><br />
所以愿意，舍得让你飞翔更高的地方去。<br /><br />
也许放弃，宁静的夏天，听课，天空一片<br /><br />
哈喽,大家好,<br /><br />
听见傍晚，车窗外，未来有一个人在等待，<br /><br />
如果梦想没别大海冷冷拍下，又怎么会晓得哈哈,<br /><br />
所以愿意，舍得让你飞翔更高的地方去。<br /><br />
也许放弃，宁静的夏天，听课，天空一片念经<br /><br />
不是寂寞才想你，而是因为想你才寂寞，袭来的窗台，不雅天台伤怀，滴滴答答等你来<br /><br />
泪湿的等到下一个春秋，邓蕾落下的时候，所有风景都成膜，月光轻轻，所有屋面的页，想你够不够<br /><br />
看云水漂流，看着落叶被带走，等到下一个春秋
</div>
</form>
</body>
</html>