Tip: you can modify some code before running
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ptml xmlns="http://www.w3.org/1999/xhtml"> <pead> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Delete repeated items in select</title> <style type="text/css">Body {text-align: center;} div {width: 400px; background: # f1f5fa; margin: auto; border: solid 1px # BFC9DB; padding: 10px ;} h4 {} a {text-align: right; display: block; font-size: 12px ;}</style> <script type="text/javascript">/* Define the global function $ */function $ (id) {return document. getElementById (id);}/* initialize select */function InitialSelectOption (id) {var oSel = $ (id); var aOptions = ["Wang Hongjian", "Wang Hongjian ", "Nicolas Smith", "Nicolas Smith", "David Gates", "Wang Hongjian", "Wang Hongjian", "Nicolas Smith ", "Nicolas Smith", "David Gates"]; var I = 0; oSel. options. length = 0; while (I<aOptions.length){ var option=new Option(aOptions[i],i); oSel.options.add(option); i++; } oSel.setAttribute("size",i-1); $("btnDistinct").removeAttribute("disabled"); } /*删除重复项*/ function DistinctSelectOption(id){ var oSel=$(id); var i=0; while(i<oSel.options.length){ var j=i+1; while(j<oSel.options.length){ if(oSel.options[i].text==oSel.options[j].text){ oSel.options[j]=null;//不可使用oSel.options.remove(j)，因为不兼容firefox }else{ j++; } } i++; } oSel.setAttribute("size",i); $("btnDistinct").setAttribute("disabled","disabled"); } window.onload=function(){ /*初始化*/ $("btnInital").onclick=function(){InitialSelectOption("sel");}; /*删除重复项*/ $("btnDistinct").onclick=function(){DistinctSelectOption("sel");}; $("btnDistinct").setAttribute("disabled","disabled"); } </script> </pead> <body> <div> <p>Demo of deleting select repeated items</p>Http://www.111cn.net/<pr /> <select id="sel" multiple="multiple" size="1"><option>Waiting for initialization...</select> <pr /> <button id="btnInital">Initialization</button> <button id="btnDistinct">Delete duplicate items</button> </div> </body> </ptml>
Tip: you can modify some code before running
