最近项目中要求做一个查询条件，按照表格中的某一列里的数据将其显示到下拉框中方便用户筛选查询，该组数据是汉字和数字的组合，因此我做了个比较笨的方法去掉里面的数字，方法如下：
html：
<!DOCTYPE html> <html lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <style> select{ margin:0 auto; } </style> <title>欢迎</title> </head> <body> <label class="control-label" style="100px;margin-right:5px;">原始数据:</label> <select name="state1"> <option>测试代码-1002-210</option> <option>生产车间代码-203042-2</option> <option>生产车间代码-204242-51</option> <option>生产车间代码-203042-4</option> <option>机号-11124</option> <option>机号-1244</option> <option>机号-134</option> <option>国家编码-22-4523-1</option> <option>国家编码-22-45632-2</option> </select><br><br><br><br> <label class="control-label" style="100px;margin-right:5px;">新生成的数据:</label> <select name="state2" id="state"> </select> </body>
js：
<script> $(function(){ var oldStr=["测试代码-1002-210","生产车间代码-203042-2","生产车间代码-204242-51","生产车间代码-203042-4","机号-134","机号-1244","机号-11124","国家编码-22-45632-1","国家编码-22-45632-2"]; var newSelect=[]; var newArr=[]; var newObj={}; var newOp="";
//通过正则找到数字的角标，然后截取角标之前的汉字 for(var i=0;i<oldStr.length;i++){ var num=oldStr[i].search(/[0-9]/ig)-1; var newStr=oldStr[i].substring(0,num); newSelect.push(newStr); } //遍历新的只有汉字的数组并去重 for(var j=0;j<newSelect.length;j++){ if(!newObj[newSelect[j]]){ newArr.push(newSelect[j]); newObj[newSelect[j]]=1; } }
//循环生成标签加入到页面元素中 for(var k=0;k<newArr.length;k++){ newOp+="<option>"+newArr[k]+"</option>" } $("#state").html(newOp); }); </script> </html>