
正文
javascript筛选,js对象筛选
提示:扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
javascript筛选数字
----------------------------
可以用正则表达式逐项匹配,直到提取出所有数值数据!
以下为演示页面代码:
htmlhead
script language="JavaScript" type="text/JavaScript"
!--
/*------------------------------
* Array MatchNumber(string s);
* s为待提取的字符串
* 函数返回数值型数组
*------------------------------
*/
function MatchNumber(s){
var i=0, j, t;
var myarray = new Array();
while (s != "") {
s = s.replace(/^[^\d]+/,"");
if ((t=s.match(/^[\d]+/)) != null) {
myarray[i] = t[0];
++i;
}s = s.replace(/^[\d]+/,"");
}
return myarray;
}
/*------------------------------
* show(string s);
* s为待提取的字符串
* 函数显示提取出的数值集
*------------------------------
*/
function show(s)
{
var re="", i, len;
var myarray = new Array();
myarray = MatchNumber(s);
len = myarray.length;
for (i=0;ilen;++i) re += myarray[i]+'\n';
alert(re);
}
//--
/script
/headbody
textarea name="textarea" cols="40" rows="5"pinput type="button" name="Submit" value=" OK " onClick="show(document.all.textarea.value)"/p
/body/html
相关问答
Q1: javascript组合筛选。只能筛选一级的怎么进行第二级筛选
//按照你的写法来,假定三组条件是任意组合的进行检索,那么就跟几级无所谓啦,直接全部进行检索就行了
var ashow = new Array();
var jiansuotiaojian = {//这里是存放检索条件的容器,及时更新
};
var oPick1 = document.getElementById('pick1');
var oPick2 = document.getElementById('pick2');
var oPick3 = document.getElementById('pick3');
var a1 = oPick1.getElementsByTagName('span');
var a2 = oPick2.getElementsByTagName('span');
var a3 = oPick3.getElementsByTagName('span');
for(var i=1;ia1.length;i++){
a1[i].onclick= function(){
pickType('direction');
}
}
for(var i=1;ia2.length;i++){
a2[i].onclick = function(){
pickType('classify');
};
}
for(var i=1;ia3.length;i++){
a3[i].onclick = function(){
pickType('difficulty');
}
}
function pickType(type){
//1.获得内容
var text = this.innerText;
text = text == '全部' ? '' : text;
//2.更新检索内容
jiansuotiaojian[type] = text;
//3.根据检索条件进行检索
for(var i=0;isubjectses.length;i++){
var obj = subjectses[i];
//是否符合条件
if( (jiansuotiaojian.direction == '' || jiansuotiaojian.direction == obj.direction ) (jiansuotiaojian.classify == '' || jiansuotiaojian.classify == obj.classify) || (jiansuotiaojian.difficulty == '' || jiansuotiaojian.difficulty == obj.difficulty)){
aShow.push(obj);
}
}
//4.显示
for(var i=0;iaShow.length;i++){
doshow(i);
}
}
//以上代码直接在编辑器中编写,语法逻辑及是否成功未经测试,提供一个思路。
Q2: js对象操作——多条件筛选
之前在做多条件筛选时用到了对象,多条件筛选的思路,并总结了几个关于对象的操作
var array = new Object()
创建一个空对象用来存储你传的参数,就是每个点击事件都要传参且也要将参数存储起来
同时筛选里面也会涉及到清空参数以及删除某一个值,例子:
var array={"name": "xiaojiayu", "age": 24, "gender": "man","sex":""};
1、删除对象里某一个值
delete array.name
2、清空对象
for(var key in array){
delete array[key]
}
3、清除对象里空的键值对
for(var key in array){
if(array[key] === ""){
delete array[key]
}
}
Q3: 如何通过javascript实现excel数据自动筛选功能?
写下思路吧:
写个过滤的function
var allData = []; //数组
function filter(key){
var len = allData .length;
var result = [];
for(var i=0;ilen;i++){
if(allData[i].indexOf(key)!=-1){//key 拉列表框选择相应项
result.push(allData[i]);
}
}
return result;
}
Q4: JS 前端的筛选代码
先给大家展示下效果图,如果大家感觉效果不错,请参考实现代码:
因为这是我自己第一次动手用js写分页,写的应该也不是很完美,有些公共的没有抽取出来,但是用起来还是可以的,这块代码是可以把它当做公共的分页去处理的,我就是用这块代码写了两个稍微不同一些的分页!公共的代码抽取的也差不多,主要就是ajax后台以及返回的值不同而已,只要把总页码的值获取到,点击首页/下一页等传值正确的话,基本上分页是不会出什么问题的
网上确实有很多分页的插件以及开源代码,单本是一个后台开发猿,前台css等样式还驾驭不住,所以就开始自己去写了。其实这个分页原理很简单,就是用ajax往后台传值(当前页码),后台使用limit进行分页。
废话不多说,直接上代码了!
注:本项目是全程使用js来写的,前台的数据通过ajax进行获取,然后再进行拼装,动态加载到页面。
1.先把上一页,下一页等的代码附上(里面的值都是伪值,下面会在js里进行重新赋值的!)
ul class="page" id="page" li id="shouye" class="p-prev disabled" a href='javascript:indexpage(1);'首 页/a /li li id="shangyiye" class="p-prev disabled" a href='javascript:indexpage(-1);'i/i上一页/a /li li a id="one" href="javascript:void(0);" 1/a/li lia id="two" href="javascript:void(0);" 2/a/li lia id="three" href="javascript:void(0);" 3/a/li li class="more"a id="five" href="javascript:void(0);" .../a/li lia id="fore" href="javascript:void(0);" 13855/a/li li class='p-next' a href='javascript:indexpage(-3);' onclick="jumpToPage('2','/goods/ajaxqueryGoodsList.do.html','','goodsListContainer','13855', listPageCallback);"下一页i/i/a /li li id="weiye" class='p-next' a href='javascript:void(0);' onclick="indexpage(0);"尾 页/a /li li class="total" span id="span_number"共13855页 到第input type="text" id="input_number" class="page-txtbox" /页 input name="" value="确定" type="button" onclick="jumpToPage(jQuery('#input_number').val(),'/goods/ajaxqueryGoodsList.do.html','','goodsListContainer','13855', listPageCallback);" class="page-btn"/ /span /li /ul
2.首先在页面放两个隐藏域,一个是当前页码,一个是总页码,总页码是页面加载完,从后台查询出来后直接附上值的,当前页码是没操作一个,就要对当前页码赋值
input id="jiazai" type="hidden" /input!-- 当前页码 -- input id="totalpage" type="hidden" /input!-- 总页码 --
3.写一个页面加载完的function,给总页码和当前页码赋值
$(function(){ $('#jiazai').val(1);//给当前页码进行赋值,默认为第一页 ajaxfunction(page,arg,chipssort,'');//这个方法是抽取的ajax后台访问的方法 });
4.抽取的ajax方法,此页面会用到好几次这个方法,所有把它收取了出来,因为页面的数据时通过ajax从后台获取到的,后台返回的是一个List集合
//抽取ajax的方法 function ajaxfunction(page,arg,chipssort,fontval){ $.ajax({ type:'POST', url:'/admin/receptionchips/showlist',//请求的url地址 data:{ page:page, sort:arg, chipssort:chipssort, fontval:fontval }, dataType:'json', contentType:'application/x-www-form-urlencoded; charset=utf-8', success:function(data){ //返回值在进行访问抽取的方法,从后台返回 commonfunction(data); } }); }
3.代码看到这也不是很多,最后一个了
//抽取拼串的方法 function commonfunction(data){ $('#projectlist').find("li").remove(); for (var i=0;idata.length;i++ ) { /*****因为此页面是动态加载的,这里主要就是进行拼串,代码也不少,就不漏出来占空间了*****/br }br//开始是分页的核心了 if(data.length0){ //设置页码 var pading = data[0].padingnum;//总页码 $('#totalpage').val(pading); var page = $('#jiazai').val();//当前页 $('#countpage').html("b id='currentPageNo'"+page+"/b/"+pading+""); $('#span_number').html("共"+pading+"页 到第input type='text' id='input_number' class='page-txtbox' /页input name='' value='确定' type='button' onclick='indexpage(-2)'/goods/ajaxqueryGoodsList.do.html','','goodsListContainer','"+pading+"', listPageCallback);' class='page-btn'/") }else{ $('#countpage').html("b id='currentPageNo'"+0+"/b/"+0+""); } //设置分页的底部 就是 首页 1 2 3 4 5 6 尾页 var pading = data[0].padingnum;//总页码href="javascript:void(0);" var nowpage = $('#jiazai').val();//当前页 //one two three five forebr//下面代码看着是比较麻烦,但是也不难理解 全是一样的代码,只不过是加了些判断 if(nowpage5 ){ $('#one').text(1); $('#one').attr('href','javascript:pagenum("'+1+'");'); $('#two').text(2); $('#two').attr('href','javascript:pagenum("'+(2)+'");'); $('#three').text(3); $('#three').attr('href','javascript:pagenum("'+(3)+'");'); $('#five').text(4); $('#five').attr('href','javascript:pagenum("'+(4)+'");'); $('#fore').text(5); $('#fore').attr('href','javascript:pagenum("'+(5)+'");'); $('#five').parent().show(); $('#fore').parent().show(); }else{ //alert("已经不是第五页了"); //设置中间的为当前页 $('#one').text(Number(nowpage)-2); $('#one').attr('href','javascript:indexpage("'+(Number(nowpage)-2)+'");'); $('#two').text(Number(nowpage)-1); $('#two').attr('href','javascript:indexpage("'+(Number(nowpage)-1)+'");'); $('#three').text(nowpage); $('#three').attr('href','javascript:indexpage("'+(nowpage)+'");'); $('#five').parent().show(); $('#fore').parent().show(); //判断下一页是否超过了总页数 if(Number(nowpage)+1pading){ $('#five').parent().hide(); $('#fore').parent().hide(); }else{ $('#five').parent().show(); $('#five').text(Number(nowpage)+1); $('#five').attr('href','javascript:indexpage("'+(Number(nowpage)+1)+'");'); } //判断下一页的第二页是否超过了总页数 if(Number(nowpage)+2pading){ $('#fore').parent().hide(); }else{ $('#fore').parent().show(); $('#fore').text(Number(nowpage)+2); $('#fore').attr('href','javascript:indexpage("'+(Number(nowpage)+2)+'");'); } } //如果总页数小于5,这块代码主要就是设置 1 2 3 4 5 这些的显示和隐藏的 if(pading==0){ $('#one').parent().hide(); $('#two').parent().hide(); $('#three').parent().hide(); $('#five').parent().hide(); $('#fore').parent().hide(); }else if(pading==1){ $('#shouye').hide(); $('#weiye').hide(); $('#one').parent().hide(); $('#two').parent().hide(); $('#three').parent().hide(); $('#five').parent().hide(); $('#fore').parent().hide(); }else if(pading==2){ $('#one').parent().show(); $('#two').parent().show(); $('#three').parent().hide(); $('#five').parent().hide(); $('#fore').parent().hide(); }else if(pading==3){ $('#one').parent().show(); $('#two').parent().show(); $('#three').parent().show(); $('#five').parent().hide(); $('#fore').parent().hide(); }else if(pading==4){ $('#one').parent().show(); $('#two').parent().show(); $('#three').parent().show(); $('#five').parent().show(); $('#fore').parent().hide(); }else{ $('#one').parent().show(); $('#two').parent().show(); $('#three').parent().show(); $('#five').parent().show(); $('#fore').parent().show(); } //设置高亮显示的,就是是第一页时,1亮,第二页时 2亮 $('#page a').each(function() { $(this).parent().removeClass("current"); if($(this).text()==nowpage){ $(this).parent().addClass("current"); } }); //分页完返回页面顶端 $("html,body").animate({scrollTop:0}, 500); //最后,给当前页码加1 $('#jiazai').val(Number(bianlaing)+Number(1)); }
好了,到这里分页就完成了,如果你们需要使用的话,可能会话费一会去理解我的代码,其实代码不难,我是使用了两个小时把它写完的,只要一行一行代码看,并且自己再加注释,把这块弄过去,不出半小时绝对搞定!






