分享一个简单的JS搜索并分页并散分

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
#page a,#page b{margin-right:5px;}
</style>
<script type="text/javascript">
var alltxt="2011年考研-上海财经大学金融学（网授）-国庆提高班1,2011年考研-上海财经大学金融学（网授）-国庆提高班2,2011年考研-上海财经大学金融学（网授）-国庆提高班3,2011年考研-上海财经大学金融学（面授）-国庆提高班4,2011年考研-上海财经大学金融学（面授）-一卡通5,2011年考研-上海财经大学dsad金融学（面授）-一卡通6,2011年考研-上海财经大dsadas学金融学（网授）-一卡通7,2011年考研-上海财经大学金融dsadasd学（网授）-一卡通8,2011年考研-上海财经大学金融学（网授）-国庆提高班9,2011年考研-上海财经大学金融学（网授）-国庆提高班10,2011年考研-上海财经大学金融学（网授）-国庆提高班11,2011年考研-上海财经大学金融学（网授）-国庆提高班12";//所有内容用英文豆号（,)分开
var pcount=3;//每页数量
var searchtxt=""; //搜索结果
function searchs() //搜索内容
{
searchtxt="";
txt=document.getElementById("stxt").value;
//alert(txt);
var re= new RegExp(txt);
var alls=alltxt.split(',');

for(var i=0,len=alls.length;i<len;i++)
{
var pos = alls[i].search(re);
if(pos != -1)
{
searchtxt+=alls[i]+",";
}
}
if(searchtxt=="")
{
searchtxt="没有搜索到相关信息";
document.getElementById("show").innerHTML=searchtxt;
}
else
{
var sch_all=searchtxt.split(',');
allpage=getpage();
var showcont="";
var pagelist="";
gopage(1);
}

}
function getpage(){ //获取总页数
var sch_all=searchtxt.split(',');
var allcount=(sch_all.length-1)/pcount; //一共有几页
if(sch_all.length%pcount>1)
{
allcount+=1;
}
return allcount;
}
function getlcont(){ //获取最后一个页面的记录数
var sch_all=searchtxt.split(',');
var allcount=(sch_all.length-1)%pcount;
return allcount;
}
function gopage(p) //跳转到第几个页面
{
var tcount=0;
var sch_all=searchtxt.split(',');
allpage=parseInt(getpage());
var showcont="";
var pagelist="";
//alert((p-1)*pcount);
//alert(sch_all.length-1);
lcont=getlcont();
//alert(allpage+"___"+p+"VS"+lcont+"___"+pcount);
if(allpage==p &&lcont<pcount && lcont!=0)
{
tcount=pcount*(p-1)+lcont;
}
else if(allpage==p && lcont==0)
{
tcount=pcount*p;
//alert(tcount);
}
else
{
tcount=pcount;
}
showcont+="<ul id=\"list\">";
if(allpage==p)
{
for(var i=(p-1)*pcount;i<tcount;i++)
{
showcont+="<li>"+sch_all[i]+"</li>";
}
}
else
{

for(var i=(p-1)*pcount;i<tcount*p;i++)
{
showcont+="<li>"+sch_all[i]+"</li>";
}
}
showcont+="</ul>";
for(var i=1;i<=allpage;i++)
{
if(i==p)
pagelist+="<b>"+i+"</b>";
else
pagelist+="<a href='javascript:gopage("+i+")'>"+i+"</a>";
}
document.getElementById("show").innerHTML=showcont;
document.getElementById("page").innerHTML=pagelist;
}
</script>
</head><body>
<div id="show"></div>
<div id="page"></div>
<input type="text" value="" id="stxt" />
<input type="button" value="搜索" onclick="searchs()" />
<script>searchs();</script>
</body>
</html>如果要查看运行效果请进入。（http://www.ok22.org/art_detail.aspx?id=197）

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

http://www.ok22.org/art_detail.aspx?id=197
不能访问?
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
#page a,#page b{margin-right:5px;}
</style>
<script type="text/javascript">
var alltxt="2011年考研-上海财经大学金融学（网授）-国庆提高班1,2011年考研-上海财经大学金融学（网授）-国庆提高班2,2011年考研-上海财经大学金融学（网授）-国庆提高班3,2011年考研-上海财经大学金融学（面授）-国庆提高班4,2011年考研-上海财经大学金融学（面授）-一卡通5,2011年考研-上海财经大学dsad金融学（面授）-一卡通6,2011年考研-上海财经大dsadas学金融学（网授）-一卡通7,2011年考研-上海财经大学金融dsadasd学（网授）-一卡通8,2011年考研-上海财经大学金融学（网授）-国庆提高班9,11年考研-上海财经大学金融学（网授）-国庆提高班10,2011年考研-上海财经大学金融学（网授）-国庆提高班11,2011年考研-上海财经大学金融学（网授）-国庆提高班21";//所有内容用英文豆号（,)分开
var pcount=3;//每页数量
var searchtxt=""; //搜索结果
function searchs() //搜索内容
{
    searchtxt="";
    txt=document.getElementById("stxt").value;
    //alert(txt);
    var re= new RegExp(txt);
    var alls=alltxt.split(',');

    for(var i=0,len=alls.length;i<len;i++)
    {
        var pos = alls[i].search(re);
        if(pos != -1)
        {
            searchtxt+=alls[i]+",";
        }
    }
    if(searchtxt=="")
    {
        searchtxt="没有搜索到相关信息";
        document.getElementById("show").innerHTML=searchtxt;
    }
    else
    {
        var sch_all=searchtxt.split(',');
        allpage=getpage();
        var showcont="";
        var pagelist="";
        gopage(1);
    }

}
function getpage(){ //获取总页数
    var sch_all=searchtxt.split(',');
    var allcount=(sch_all.length-1)/pcount; //一共有几页
    if(sch_all.length%pcount>1)
    {
        allcount+=1;
    }
    return allcount;
}
function getlcont(){ //获取最后一个页面的记录数
    var sch_all=searchtxt.split(',');
    var allcount=(sch_all.length-1)%pcount;
    return allcount;
}
function gopage(p) //跳转到第几个页面
{
    var tcount=0;
    var sch_all=searchtxt.split(',');
    allpage=parseInt(getpage());
    var showcont="";
    var pagelist="";
    //alert((p-1)*pcount);
    //alert(sch_all.length-1);
    lcont=getlcont();
    //alert(allpage+"___"+p+"VS"+lcont+"___"+pcount);
    if(allpage==p &&lcont<pcount && lcont!=0)
    {
        tcount=pcount*(p-1)+lcont;
    }
    else if(allpage==p && lcont==0)
    {
        tcount=pcount*p;
        //alert(tcount);
    }
    else
    {
        tcount=pcount;
    }
    showcont+="<ul id=\"list\">";
    if(allpage==p)
    {
        for(var i=(p-1)*pcount;i<tcount;i++)
        {
            showcont+="<li>"+sch_all[i]+"</li>";
        }
    }
    else
    {

        for(var i=(p-1)*pcount;i<tcount*p;i++)
        {
            showcont+="<li>"+sch_all[i]+"</li>";
        }
    }
    showcont+="</ul>";
    for(var i=1;i<=allpage;i++)
    {
        if(i==p)
            pagelist+="<b>"+i+"</b>";
        else
            pagelist+="<a href='javascript:gopage("+i+")'>"+i+"</a>";
    }
    document.getElementById("show").innerHTML=showcont;
    document.getElementById("page").innerHTML=pagelist;
}
</script>
</head><body>
<div id="show"></div>
<div id="page"></div>
<input type="text" value="" id="stxt" />
<input type="button" value="搜索" onclick="searchs()" />
<script>searchs();</script>
</body>
</html>我在alltxt改了一个值,在高班9后去掉了20 ,然后搜索2,为什么后面的搜索不出来呢?
可能是我这边网络的问题吧,我访问CSDN都很慢.
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
#page a,#page b{margin-right:5px;}
</style>
<script type="text/javascript">
var alltxt="11,12,13,14,15,16,17,18,19,20,21,22";//所有内容用英文豆号（,)分开
var pcount=3;//每页数量
var searchtxt=""; //搜索结果
function searchs() //搜索内容
{
    searchtxt="";
    txt=document.getElementById("stxt").value;
    //alert(txt);
    var re= new RegExp(txt);
    var alls=alltxt.split(',');
    for(var i=0,len=alls.length;i<len;i++)
    {
        var pos = alls[i].search(re);
        if(pos != -1)
        {
            searchtxt+=alls[i]+",";
        }
    }
    if(searchtxt=="")
    {
        searchtxt="没有搜索到相关信息";
        document.getElementById("show").innerHTML=searchtxt;
    }
    else
    {
        var sch_all=searchtxt.split(',');
alert(sch_all.length-1);
        allpage=getpage();
        var showcont="";
        var pagelist="";
        gopage(1);
    }

}
function getpage(){ //获取总页数
    var sch_all=searchtxt.split(',');
    var allcount=(sch_all.length-1)/pcount; //一共有几页
    if(sch_all.length%pcount>1)
    {
        allcount=parseInt(allcount)+1;
    }
    return allcount;
}
function getlcont(){ //获取最后一个页面的记录数
    var sch_all=searchtxt.split(',');
    var allcount=(sch_all.length-1)%pcount;
    return allcount;
}
function gopage(p) //跳转到第几个页面
{
    var tcount=0;
    var sch_all=searchtxt.split(',');
    allpage=parseInt(getpage());
    var showcont="";
    var pagelist="";
    //alert((p-1)*pcount);
    //alert(sch_all.length-1);
    lcont=getlcont();
    //alert(allpage+"___"+p+"VS"+lcont+"___"+pcount);
    if(allpage==p &&lcont<pcount && lcont!=0)
    {
        tcount=pcount*(p-1)+lcont;
    }
    else if(allpage==p && lcont==0)
    {
        tcount=pcount*p;
        //alert(tcount);
    }
    else
    {
        tcount=pcount;
    }
    showcont+="<ul id=\"list\">";
    if(allpage==p)
    {
        for(var i=(p-1)*pcount;i<tcount;i++)
        {
            showcont+="<li>"+sch_all[i]+"</li>";
        }
    }
    else
    {

        for(var i=(p-1)*pcount;i<tcount*p;i++)
        {
            showcont+="<li>"+sch_all[i]+"</li>";
        }
    }
    showcont+="</ul>";
    for(var i=1;i<=allpage;i++)
    {
        if(i==p)
            pagelist+="<b>"+i+"</b>";
        else
            pagelist+="<a href='javascript:gopage("+i+")'>"+i+"</a>";
    }
    document.getElementById("show").innerHTML=showcont;
    document.getElementById("page").innerHTML=pagelist;
}
</script>
</head><body>
<div id="show"></div>
<div id="page"></div>
<input type="text" value="" id="stxt" />
<input type="button" value="搜索" onclick="searchs()" />
<script>searchs();</script>
</body>
</html>全整成数字试下!
var alltxt="11,12,13,14,15,2011年考研-上海财经大学dsad金融学（面授）-一卡通6,2011年考研-上海财经大dsadas学金融学（网授）-一卡通7,2011年考研-上海财经大学金融dsadasd学（网授）-一卡通8,2011年考研-上海财经大学金融学（网授）-国庆提高班9,1011年考研-上海财经大学金融学（网授）-国庆提高班10,2011年考研-上海财经大学金融学（网授）-国庆提高班11,2011年考研-上海财经大学金融学（网授）-国庆提高班21";
换成这个也行。。估计是字符删除的时候出问题了!