js分页

<%@ page language="java" pageEncoding="utf-8"%>

<%@page import="java.util.List"%>
<%@page import="java.util.ArrayList"%>
<%@page import="java.util.Map"%>
<%@page import="java.util.HashMap"%>
<%@include file="config/config_VOD.jsp" %>
<%@include file="config/config_SelfHelp.jsp" %>
<%@include file="sh_FriendRecom_Data.jsp" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html xmlns:v>
 <head>
  <title></title>
<script type="text/javascript">
 
  //下面是做分页需要的参数
  //可显示的总数量
  var allCount = fnName.length; 
  var pageCount = 8;   //每页最多现实的数量
  var startPage = 0;   //起始页位置
  var pageStart = startPage * pageCount;    //每页开始位置
  var presentNum = allCount - pageStart ;  //每页实际的显示数
  var totalNum = Math.ceil(allCount/pageCount);     //页面总数
  if(presentNum > pageCount)
  {
 presentNum = pageCount;
  }else
  {
 presentNum = allCount - pageStart;
  }
  function init()
  {
     document.body.background = bg_friRecList;
    
     //此函数显示所有推荐列表
     showRecList(1);
  }
 
 //显示数据
function showRecList(index)
{
 var str = "";
 if("无好友" != fnName[0] && "null" != fnName && null != fnName )
 {
 allCount = fnName.length;
 totalNum = Math.ceil(allCount/pageCount);
 startPage = index - 1;
 var pageStart = startPage * pageCount;
 var presentNum = allCount - pageStart ;
 if(presentNum > pageCount)
 {
  presentNum = pageCount;
 }else
 {
  presentNum = allCount - pageStart;
 }  
 str += "<table style='width:420px; font-size:14px;'>";
 for(i=0 ; i<pageCount ; i++)
 {
  if(i >= presentNum)
  {
   str += "<tr></tr>";
   }else
   {
    if(i%3==0)
    {
     str += "<tr height='31px'>";
    }else
    {
     str += "<tr height='30px'>";
    }
    
    str += "<td οnclick='chooseVod(filmId["+(i+pageStart)+"])' align='left' width='140px' style='cursor:hand;'>"+filmName[i+pageStart]+"</td>";
    str += "<td οnclick='chooseVod(filmId["+(i+pageStart)+"])' width='36px'><img width='26px' height='26px' src='"+figure[(i+pageStart)]+"'></td>";
    str += "<td οnclick='chooseVod(filmId["+(i+pageStart)+"])' align='left' width='175px' style='cursor:hand;'>"+fnName[i+pageStart]+"</td>";
    str += "<td onclick = 'showDia(filmId["+(i+pageStart)+"],contentType["+(i+pageStart)+"],fnNum["+(i+pageStart)+"])' align='center' width='69px' height='21px' style='cursor:hand;'>";
    str += "<div width='75' height='21'>";   // style='backGround-image:url("+bt_friRecDelAnd+")'
    str += "<table style='font-size:12px' width='74'><tr><td align='center' width='69' height='21'><img width='69' height='21' src='"+bt_friRecDel+"'></td></tr></table>";
    str += "</div></td>";
    str += "</tr>";
   }
  } 
  str += "</table>";
 }else
 {
  str += "暂无推荐";
 }   
 document.getElementById('content').innerHTML=str;
 getDirectionImg();
 getPageNum();
 correctPNG();
  }
   
function chooseVod(filmId)
{
    document.location.href = "vod_VideoInfo_Action.jsp?vodId="+filmId;

var filmIdIn = "";
var contentTypeIn = "";
var fnNumIn = "";
function showDia(filmIdInfo,contentTypeInfo,fnNumInfo)
{
    filmIdIn = filmIdInfo;
    contentTypeIn = contentTypeInfo;
    fnNumIn = fnNumInfo;
    showDelDiv();
    showBGDiv();
}
   
function del()
{
    document.location.href = "sh_FriendRecom_Control.jsp?methodName=del&filmId="+filmIdIn+"&contentType="+contentTypeIn+"&fnNum="+fnNumIn;
   
}  

//跳出的对话框
function showDelDiv()
{
 var str="";
 str+="<v:RoundRect style='width:250;height:100px;'  strokecolor='#1A6B92' strokeweight='2px'>";
 str+="<v:TextBox><table style='text-align:justify;font-size: 12;margin:5; letter-spacing: 1;'>";
 str+="<tr><td colspan='2'><strong> 删除提示</strong></td></tr>";
 str+="<tr><td colspan='2'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;您是否删除该影片?";
 str+="<tr><td><img id='imgConfirm' src='"+bt_confirm+"' style='cursor:hand' οnclick='del()'></td><td align='right'><img id='imgCancel' src='"+bt_cancel+"' style='cursor:hand' οnclick='cancelRec()'></td></tr>";
 str+="</table></v:TextBox></v:RoundRect>";
 document.getElementById('prompt').innerHTML=str;
 document.getElementById('prompt').style.display='block';
 document.getElementById('imgConfirm').focus();

function goBack()
{
 document.location.href="sh_Friend.jsp"; 
}   
//覆盖全屏的div   
function showBGDiv()
{
 var bgObj=document.createElement("div");
 bgObj.setAttribute('id','bgDiv');
 bgObj.style.position="absolute";
 bgObj.style.top="0";
 bgObj.style.left="0";
 bgObj.style.background="#fff";
 bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=1,opacity=3,finishOpacity=75)";
 bgObj.style.width="100%";
 bgObj.style.height="100%";
 bgObj.style.zIndex = "100";
 document.body.appendChild(bgObj);
}
   
/**
*页码显示
*/
function getPageNum()
{
 var pager = "";
 if(totalNum  == 0||totalNum==1)
 {
  pager += "1/1";
 }
 else
 {
        pager += (startPage+1) + "/"+ totalNum;
 }
 pager += "页";
 
 document.getElementById("pageNum").innerHTML = pager;
}
 
function getDirectionImg()
{
 if(totalNum >1)
  {
   if(startPage==0)
   {      
       var someChoose = "";
       someChoose += "<table width=290px height=23px style='font-size:12px;font-weight:bolder' cellspacing='10px'><tr>";   
    someChoose += "<td id='pre' οnmοuseοver=btOnMouseOver('pre') οnmοuseοut=btOnMouseOut('pre') width=69px height=23px align='center' ><img src='"+bt_Pre+"' width=69px height=23px></td>";
    someChoose += "<td id='next' οnmοuseοver=btOnMouseOver('next') οnmοuseοut=btOnMouseOut('next') οnclick='nextPage()' width=69px height=23px align='center'><img src='"+bt_Next+"' width=69px height=23px></td>";
    someChoose += "<td id='back' οnmοuseοver=btOnMouseOver('back') οnmοuseοut=btOnMouseOut('back') οnclick='back()' width=69px height=23px align='center'><img src='"+bt_Back+"' width=69px height=23px></td>";
    someChoose += "</tr></table>";
    
    document.getElementById("someChoose").innerHTML = someChoose;
       correctPNG();
   }
   if(startPage==totalNum-1 && totalNum>0)
   {
    var someChoose = "";
       someChoose += "<table width=290px height=23px style='font-size:12px;font-weight:bolder' cellspacing='10px'><tr>";    
    someChoose += "<td id='pre' οnmοuseοver=btOnMouseOver('pre') οnmοuseοut=btOnMouseOut('pre') οnclick='prePage()' width=69px height=23px style='font-size:12px;font-weight:bolder'  align='center'><img src='"+bt_Pre+"' width=69px height=23px></td>";
    someChoose += "<td id='next' οnmοuseοver=btOnMouseOver('next') οnmοuseοut=btOnMouseOut('next') width=69px height=23px  align='center'><img src='"+bt_Next+"' width=69px height=23px></td>";
    someChoose += "<td id='back' οnmοuseοver=btOnMouseOver('back') οnmοuseοut=btOnMouseOut('back') οnclick='back()' width=69px height=23px  align='center'><img src='"+bt_Back+"' width=69px height=23px></td>";
    someChoose += "</tr></table>";
    
    document.getElementById("someChoose").innerHTML = someChoose;
       correctPNG();
   }
   if(startPage>0 && (startPage+1<totalNum))
   {
    var someChoose = "";
     someChoose += "<table width=290px height=23px style='font-size:12px;font-weight:bolder' cellspacing='10px'><tr>";     
    someChoose += "<td id='pre' οnmοuseοver=btOnMouseOver('pre') οnmοuseοut=btOnMouseOut('pre') οnclick='prePage()'  align='center' width=69px height=23px style='font-size:12px;font-weight:bolder'><img src='"+bt_Pre+"' width=69px height=23px></td>";
    someChoose += "<td id='next' οnmοuseοver=btOnMouseOver('next') οnmοuseοut=btOnMouseOut('next') οnclick='nextPage()' width=69px height=23px  align='center'><img src='"+bt_Next+"' width=69px height=23px></td>";
    someChoose += "<td id='back' οnmοuseοver=btOnMouseOver('back') οnmοuseοut=btOnMouseOut('back') οnclick='back()' width=69px height=23px  align='center'><img src='"+bt_Back+"' width=69px height=23px></td>";
    someChoose += "</tr></table>";
    
    document.getElementById("someChoose").innerHTML = someChoose;
       correctPNG();
   }
  }else
  {
     var someChoose = "";
     someChoose += "<table width=290px height=23px style='font-size:12px;font-weight:bolder' cellspacing='10px'><tr>";     
    someChoose += "<td id='pre'  align='center' width=69px height=23px style='font-size:12px;font-weight:bolder'><img src='"+bt_Pre+"' width=69px height=23px></td>";
    someChoose += "<td id='next' width=69px height=23px  align='center'><img src='"+bt_Next+"' width=69px height=23px></td>";
     someChoose += "<td id='back' οnclick='goBack()' width=69px height=23px  align='center'><img src='"+bt_Back+"' width=69px height=23px></td>";
    someChoose += "</tr></table>";
    
    document.getElementById("someChoose").innerHTML = someChoose;
       correctPNG();
  }
}

function friendList()
{
   document.location.href = "sh_FriendList.jsp";
}
function friendInfo()
{
 document.location.href='sh_FriendInfo.jsp';
}

//取消推荐
function cancelRec()
{
     document.getElementById('prompt').style.display = 'none';
     var bgObj=document.getElementById('bgDiv');
     document.body.removeChild(bgObj);
   

</script>

<script src='js/util_sh_FriendRecom.js' type="text/javascript"></script>

<style type="text/css">
  v/:*{behavior:url(#default#VML)}
</style>

 </head>

 <body οnlοad="init()" >
    <div style='font-size:12;'>
     <label style='position:absolute;top:10px;left:30;font-weight:500;cursor:hand;' οnclick='friendList()'>好友维护</label>
     <label style='position:absolute;top:10px;left:100;font-weight:800;cursor:hand;'>好友推荐</label>
     <label style='position:absolute;top:10px;left:170;font-weight:500;cursor:hand;' οnclick='friendInfo()'>用户维护</label>
    </div> 
    <div id='content' style='position:absolute; left:90px;width:279px;height:200px; top:80px;z-index:1;display:block'></div>
  
    <div id="pageNum"
  style="position:absolute;bottom:0px;top:350px;color:white;font-weight:40px;left:110px;cursor:hand;width:40px;height:20px;font-size:14px"></div>         
  
    <div id="someChoose"
  style="position: absolute; bottom: 0px; top:340px; left: 155px;cursor:hand;width:300px;height:30px"></div>    
   
    <div id='prompt' style="position:absolute;top:130;left:100;border-color: blue;z-index: 101;display:none;"></div>
    </body>
</html>

 

 

 

 

 

 

 

 

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值