jquery+json实现的搜索加分页效果
jquery+json实现的搜索加分页效果
发布时间:2016-12-30 来源:查字典编辑
摘要:1.Web里面有三个目录:1.1content.htm//这个文件直接运行就行1.2js//这里面有用到的几个js文件,其中以db开头的就是...

1.Web 里面有三个目录:

1.1 content.htm//这个文件直接运行就行

1.2 js //这里面有用到的几个js 文件,其中 以db 开头的就是数据源(就是json 串)

1.3 css //css 就不用说了

2. 直接运行 content.htm 就可以直接打开查看分页和搜索效果了

3. 原理很简单,只是用了javascript 的index 函数

核心代码:

复制代码 代码如下:

/*

author: liulf

function:

var __db_cpcj=vCpcj;

var __db_cp=vCp;

var vCp={"cppage":[

{"cpdh":"A01000101","page":"1","ca":"1309-36-0","mc":"硫铁矿","ename":"Pyrite","bm":"黄铁矿"},

{"cpdh":"A01000201","page":"1","ca":"1309-36-0","mc":"硫精砂","ename":"Pyrite concentrate;Sulfur concentrate","bm":""},

{"cpdh":"A01000202","page":"1","ca":"1309-36-0","mc":"硫精矿粉","ename":"Powdered pyrite concentrate;Pyrites concentrate,powder;Sulfur concentrate,powder","bm":"硫精矿"},

{"cpdh":"A02000101","page":"1","ca":"","mc":"磷矿石","ename":"Phosphorus ore","bm":""},

{"cpdh":"A02000111","page":"2","ca":"","mc":"磷矿砂","ename":"Phosphorite grit","bm":""},

{"cpdh":"A02000201","page":"2","ca":"","mc":"磷矿粉","ename":"Phosphate rock powder","bm":""},

{"cpdh":"A03000101","page":"2","ca":"12447-04-0","mc":"硼矿石","ename":"Ascharite;Boric ore","bm":"硼镁矿"},

{"cpdh":"A04000101","page":"2","ca":"","mc":"钾长石","ename":"Potash feldspar;Potassium feldspars","bm":""},

{"cpdh":"A04000201","page":"2","ca":"12003-63-3","mc":"长石粉","ename":"Feldspar powder","bm":""},

{"cpdh":"A04000301","page":"2","ca":"","mc":"光卤石","ename":"Carnallite","bm":""}

]}

var vCpcj={"cjpage":[{"cjdh":"110634","cm":"拜耳光翌板材有限责任公司","pagen":"1701"},

{"cjdh":"110052","cm":"北京艾瑞斯水墨有限公司","pagen":"1701"},

{"cjdh":"110408","cm":"北京艾斯克医药技术开发有限公司","pagen":"1701"},

{"cjdh":"110010","cm":"北京爱德泰普膜制品厂","pagen":"1701"},

{"cjdh":"110165","cm":"北京安实创业科技发展有限公司","pagen":"1701"},

{"cjdh":"110134","cm":"北京安顺达装饰材料有限公司","pagen":"1701"},

{"cjdh":"110291","cm":"北京奥博星生物技术责任有限公司","pagen":"1701"},

{"cjdh":"110191","cm":"北京奥得赛化学有限公司","pagen":"1701"},

{"cjdh":"110454","cm":"北京奥克兰防水工程有限责任公司","pagen":"1701"},

{"cjdh":"110520","cm":"北京奥森特种润滑材料厂","pagen":"1701"}]}

奥森特

*/

function ObjSearch()

{

this.kw = '';

this.option = '';

this.displayId = '';

this.search = function()

{

// if(this.kw=='' || this.kw==null || this.kw.length<3)

// {

// alert('输入长度不能为小于3!');

// return;

// }

// switch(this.option)

// {

// //企业

// case '0':

// this.searchCpcj();

// break;

// //产品

// case '1':

// this.searchCp();

// break;

// }

OutputHtml(this);

}

this.searchCpcj= function()

{

var jsonObj = new Array();

var kw = this.kw;

// $('#'+this.displayId).html('');

// var displayId = this.displayId;

$(vCpcj.cjpage).each(function(index,content){

// var cjdhy = content.cjdh;

// var cm = content.cm;

// var pagen = content.pagen;

if(content.cm.indexOf(kw)!=-1)

{

// $('#'+displayId).append("<a href='#'>"+cm+" | "+pagen+"</a><br/>");

jsonObj.push({"cm":content.cm,"pagen":content.pagen});

}

});

return jsonObj;

}

this.searchCp = function()

{

var jsonObj = new Array();

var kw = this.kw;

// $('#'+this.displayId).html('');

// var displayId = this.displayId;

$.each(vCp.cppage,function(index,content){

// var cpdh = content.cpdh;

// var page = content.page;

// var ca = content.ca;

// var mc = content.mc;

// var ename = content.ename;

// var bm = content.bm;

if(content.mc.indexOf(kw)!=-1)

{

// $('#'+displayId).append("<a href='#'>"+mc+" | "+page+"</a><br/>");

jsonObj.push({"mc":content.mc,"page":content.page});

}

});

return jsonObj;

}

}

<>

打包下载地址

推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
相关阅读
网友关注
最新Javascript教程学习
热门Javascript教程学习
编程开发子分类