700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > asp+ajax实现静态页面分页的代码

asp+ajax实现静态页面分页的代码

时间:2022-09-10 08:42:20

相关推荐

asp+ajax实现静态页面分页的代码

下面小编要向大家介绍下asp+ajax实现静态页面分页的代码,看起来复杂实则是简单的,掌握好技巧就OK,喜欢就赶紧收藏起来吧!

最近因工作需要,要在静态页面上实现分页,想了下,决定用AJAX来实现,所以就捣鼓了下面这么个东西,截图如下:

代码如下:

html

head

titleAJAX静态分页/title

meta http-equiv="content-type" content="text/html;charset=gb2312"

style type="text/css"

!--

body{ Verdana,sans-serif; }

a:link,a:visited { color:#00f;; }

a:hover{ color:#f00;; }

#main{ # #999 solid;% auto; }

#title{ % #999 solid;; }

#left{ %; }

#right{ %; }

#content { % 0;; }

#download { % 0;%; }

--

/style

script type="text/javascript"

!--

function createAjax() { //该函数将返回XMLHTTP对象实例

var _xmlhttp;

try {

_xmlhttp=new ActiveXObject(""); //IE的创建方式

}

catch (e) {

try {

_xmlhttp=new XMLHttpRequest(); //FF等浏览器的创建方式

}

catch (e) {

_xmlhttp=false; //如果创建失败,将返回false

}

}

return _xmlhttp; //返回xmlhttp对象实例

}

function getweblist(page) { //该函数用来获取分页数据

var xmlhttp=createAjax(); //创建变量xmlhttp,并将createAjax()函数创建的对象实例赋于它

if (xmlhttp) { //如果xmlhttp对象创建成功,则执行条件语句中的程序

var content=(\); //获取页面中id为content的对象

xmlhttp.open(get,server.asp?page="+page+"&n="+Math.random(),true); //打开与服务器的连接,其中get为连接方式,server.asp为要连接的页面,有两个参数,其中第一个参数page为需要返回数据的页数,第二个参数n为一个随机数,这样每次发送的URL都会不一样,相当于都向服务器发出一个新的请求,避免浏览器缓存数据。

xmlhttp.onreadystatechange=function() { //为xmlhttp对象的readyState属性指定事件,改属性值改变时,则会执行其中的程序

if (xmlhttp.readyState==4 && xmlhttp.status==200) { //如果xmlhttp.readyState==4并且xmlhttp.status==200时,执行条件中的程序,其中readyState有五个值,4为请求完成,是客户端向服务器提交的数据成功到达,status有N多值-_-!!,其中200为OK,是指服务器向客户端完成发送数据。

content.innerHTML=unescape(xmlhttp.responseText); //将服务器返回的数据解码并写入指定的ID中。

}

else {

content.innerHTML="span正在从服务器提取数据....../span; //如果服务器没有完成传送,则向用户提示正在传输。

}

}

xmlhttp.send(null); //向服务器发送请求,因为是get请求,会直接附在URL后面,所以这里括号中的数据为null,IE中也可以不写,但FF就必须加上null,否则会发送失败。

}

}

function edit() { //编辑分页显示条数的函数

var str="form每页显示 input type="text" size="3" 条 input type="button" value="保存" input type="button" value="取消"/form" //定义html字符串

var right=document.getElementById( ight); //获得页面中的right对象。

right.innerHTML=str; 将str变量的值写入该对象中。

}

function rightinfo() { //right对象中的原始信息,请在页面开始和被显示条数被修改后调用

document.getElementById( ight).innerHTML="a href="javascript:void(edit())"Edit/a";

}

function save() { //保存修改后的显示条数

var pagesize=document.getElementById(pagesize); //这个就不写了,跟上面的用法一样。

if (pagesize.value==""||/[0-9]+/.test(pagesize.value)==false) { //确定用户输入的新数据是不是一个数字

alert("请正确填写每页显示条数! ");

return;

}

var xmlhttp=createAjax(); //创建对象

if (xmlhttp) {

xmlhttp.open(get,set.asp?pagesize="+pagesize.value+"&n="+Math.random(),true) //参上同看

xmlhttp.onreadystatechange=function() {

if (xmlhttp.readyState==4 && xmlhttp.status==200) {

document.getElementById("right).innerHTML=unescape(xmlhttp.responseText); //先写入从服务器返回的字符串,如果成功,会写入completed。

getweblist(1); //从新获取新修改后的第一页的数据

setTimeout( ightinfo(),3000); //3秒后将right对象的原始字符串写入。

}

else {

document.getElementById(pagesize).disabled=true; //将几个FORM表单的元素都设为不可改动

document.getElementById(savebtn).disabled=true;

document.getElementById(cancelbtn).disabled=true;

}

}

xmlhttp.send(null); //发送请求。

}

}

//--

/script

/head

body onload="getweblist(1);rightinfo();"

div

div

div静态分页的AJAX实现/div

div/div

/div

div/div

div

作者:十一狼br /

联系:275915854(QQ)[email protected](email)br /

下载:a href="/Ajax.rar" target="_blank"/Ajax.rar/a

/div

/div

/body

/html

打包文件下载

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。