手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >JS+Ajax+Jquery实现页面无刷新分页以及分组 超强的实现第1/2页
JS+Ajax+Jquery实现页面无刷新分页以及分组 超强的实现第1/2页
摘要:复制代码代码如下:GroupText活动名称发送方接收方发送时间发送内容积分状态共0条记录目前第0/0页Common.js复制代码代码如下:...

复制代码 代码如下:

<%@ Page language="c#" Codebehind="GroupText.aspx.cs" AutoEventWireup="false" Inherits="test1.GroupText" %>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >

<HTML>

<HEAD>

<title>GroupText</title>

<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">

<meta name="CODE_LANGUAGE" Content="C#">

<meta name="vs_defaultClientScript" content="JavaScript">

<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">

<LINK href="css/wmh.css" href="css/wmh.css" type="text/css" rel="stylesheet">

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

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

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

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

<script language="javascript"><></script>

</HEAD>

<body MS_POSITIONING="GridLayout">

<form id="Form1" method="post" runat="server">

<div>

<table cellSpacing="0" cellPadding="0" width="100%" border="0">

<tr>

<td >活动名称</td>

<td>发送方</td>

<td>接收方</td>

<td>发送时间</td>

<td>发送内容</td>

<td>积分</td>

<td>状态</td>

</tr>

<tr>

<td vAlign="top" width="100%" colSpan="7"

height="100%">

<div id="divcontent" align="left"></div>

</td>

</tr>

<tr>

<td

width="100%" colSpan="10">

<table width="100%">

<tr>

<td>共<span id="recordcount">0</span>条记录

目前第<span id="curpageindex">0</span> <font color="red">/</font><span id="pgcount">0</span>页

<input id="gototxt" type="text" maxLength="10" name="gototxt" runat="server">

<input id="gotopg" type="button"></td>

<td align="right"><IMG id="btnfirst" alt="首页" src="Images/first.gif">

<IMG id="btnpre" alt="上一页" src="Images/btn_pre.gif" > <IMG id="btnnext" alt="下一页" src="Images/btn_next.gif" >

<IMG id="btnlast" alt="尾页" src="Images/btn_last.gif" >

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

</form>

</body>

</HTML>

Common.js

复制代码 代码如下:

Common.js:

//时间格式化

function getDateByFormat(oldDate){

var Dy = oldDate.getFullYear();

var Dm = oldDate.getMonth()+1;

var Dd = oldDate.getDate();

if(Dm<10){

Dm = "0" + Dm;

}

if(Dd<10){

Dd = "0" + Dd;

}

var newDate = Dy+'-'+Dm+'-'+Dd;

return newDate;

}

//日期-时间格式化

function getDateTimeByFormat(oldDate){

var Dy = oldDate.getFullYear();

var Dm = oldDate.getMonth()+1;

var Dd = oldDate.getDate();

var Dh = oldDate.getHours();

var Dmi = oldDate.getMinutes();

var Ds= oldDate.getSeconds();

if(Dm<10)

Dm = "0" + Dm;

if(Dd<10)

Dd = "0" + Dd;

if(Dh<10)

Dh = "0" + Dh;

if(Dmi<10)

Dmi = "0" + Dmi;

if(Ds<10)

Ds = "0" + Ds;

var newDate = Dy+'-'+Dm+'-'+Dd+' '+Dh+':'+Dmi+':'+Ds;

return newDate;

}

//只能输入数字

function txtnumber()

{

if ((event.keyCode >57) || (event.keyCode <48))

return false;else return true;

}

//只能输入数字和字母

function txtnumchar()

{ //65- 90 97-122

var kcode = event.keyCode;

if (kcode >= 48 && kcode <= 57)

return true;

else if(kcode >= 65 && kcode <= 90)

return true;

else if (kcode >= 97 && kcode <= 122)

return true;

else

return false;

}

getCommonTable.js

复制代码 代码如下:

getCommonTable.js

//获取table头

function getTableHeadByWidth(widthSize,ids){

var Tableone = "<table id='tab"+ids+"' border='0' cellspacing='0' cellpadding='0' ";

var Tabletwo = ">";

if (widthSize == "")

return Tableone + Tabletwo;

else

return Tableone+"width="+widthSize+Tabletwo;

}

//获取第一个tr td 传一个宽度值

function getTrAndTdFirstByCWidth(classname,widthSize){

var tdone = " <tr ";

var tdtwo = "><td align='center' ";

var tdthr = " > ";

if (classname =="")

tdone += tdtwo;

else

tdone+=" class ='"+classname+"' "+tdtwo;

if (widthSize == "")

tdone += tdthr;

else

tdone += " width="+widthSize+tdthr;

return tdone;

}

//获取下一个TD,传一个宽度值

function getTdNextByWidth(widthSize){

var tdone = "</td><td align='center' ";

var tdtwo =">";

if (widthSize =="")

return tdone+tdtwo;

else

return tdone+"width="+widthSize+tdtwo;

}

//获取最后一个td

function getTdLastByWidth(widthSize){

var tdone = "</td><td align='center' ";

var tdtwo =">";

if (widthSize =="")

return tdone+tdtwo;

else

return tdone+"width="+widthSize+tdtwo;

}

//获取最后一个tr/td

function getTrAndTdLast(){

return "</td></tr>";

}

//获取table尾

function getTableLast(){

return "</table>";

}

//获取img

function getImgByParams(imgUrl,altstr,eventName,eventParams,imgid){

var one = "<img border='0'";

if (imgUrl != "")

one += "src='"+imgUrl+"'";

if (altstr != "")

one += "alt='"+altstr+"'";

if(imgid != "")

one += "id='"+imgid+"'";

one += "onclick='"+eventName+"("+eventParams+");'>";

return one

}

//--------排序---------------------------

//通过字段的内容排序

SortByBtnidAndCellName=function(btnId,cellName,celltype){

var way =getOpType(btnId);//0为正。1为倒

var ds = userdata.value;

var sortarr= new Array();

if ((ds!= null) && (typeof(ds) == "object")){

var len = ds.Rows.length;

if(celltype=='S' || celltype=='N'){

for(var j=0;j<len;j++){

sortarr[j] = ds.Rows[j][cellName];//.substr(0,1);//通过字符

}

}else if(celltype=='D'){

for(var i=0;i<len;i++){

sortarr[i] = getDateByFormat(ds.Rows[i][cellName]);//通过日期

}

}

if(sortarr!=''){

var indexarr = new Array();

indexarr = getSortArray(sortarr,celltype);//得到新的排序规则

if(indexarr != ''){

setSortAginbyWay(indexarr,way);

}

}

}

}

//获得排序

getOpType=function(btnid){//返回0正序,1为倒序

var imgName= $("#"+btnid).attr("src");

var wz = imgName.indexOf('.gif');

var oldImg =imgName.substr(wz-9,9);

if(oldImg=='sort_desc'){//当前是倒序或未排序,需要正序sort_ascc

$("#"+btnid).attr("src","../Images/sort_ascc.gif");

return 0;

}else{

$("#"+btnid).attr("src","../Images/sort_desc.gif");

return 1;

}

}

//按JS Sort排序 获得新的排序规则

getSortArray=function (sortdatearr,celltype){// 参数为array

var sortstr = '';

for(var k=0;k<sortdatearr.length;k++){

if(sortstr=='')

sortstr=sortdatearr[k];

else

sortstr+='^%^'+sortdatearr[k];

}

var newsortdate =sortdatearr;

var len = sortdatearr.length;

if(celltype =='S' || celltype =='D')

newsortdate.sort();//字符排序

else{ //数字排序

for(var i=0;i<len;i++){

var tmp =0;

for(var j=i+1;j<len;j++){

if(newsortdate[i]>newsortdate[j]){

tmp = newsortdate[i];

newsortdate[i] = newsortdate[j];

newsortdate[j] =tmp;

}

}

}

}

var tmpsortdate =sortstr.split('^%^')

var resultarr = new Array();

for(var i = 0;i<len;i++){

for(var j = 0;j<len;j++){

if(newsortdate[i]==tmpsortdate[j]){

resultarr[i] = j;

tmpsortdate[j] ='||||||||';

break;

}

}

}

return resultarr;

};

//--------------------end-------------------------------

//删除重复的手机号码

SplitRepeatMobile=function(mobile){

var mob=mobile;

for(var i=0;i<mob.length;i++){

for(var j=i+1;j<mob.length;j++){

if(mob[i]==mob[j]){

mob.splice(j,1);

}

}

}

return mob;

}

当前1/2页12下一页阅读全文

【JS+Ajax+Jquery实现页面无刷新分页以及分组 超强的实现第1/2页】相关文章:

实现无刷新联动例子汇总

js实现鼠标划过给div加透明度的方法

用JavaScript实现页面重定向功能的教程

javascript无刷新评论实现方法

基于jQuery实现的无刷新表格分页实例

jQuery实现在列表的首行添加数据

JavaScript实现表格点击排序的方法

javascript的函数第1/3页

jquery简单实现外部链接用新窗口打开的方法

js实现顶部可折叠的菜单工具栏效果实例

精品推荐
分类导航