JS去掉<select>中重复的<option>

最新推荐文章于 2024-05-14 06:42:31 发布

tianjun309

最新推荐文章于 2024-05-14 06:42:31 发布

阅读量613

点赞数

分类专栏： javascript 文章标签： JSP CSS Cache JavaScript HTML ViewUI

本文链接：https://blog.csdn.net/tianjun309/article/details/83814752

版权

javascript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>My JSP 'MyJsp.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->

  </head>
  <script type="text/javascript">
  function test()
  {
  	//（1）将所有option内容保存
	var temp = document.getElementsByTagName("option");
  	var array = new Array(temp.length);
	for (var i = 0, length= temp.length; i < length; i++){
		array[i] = temp[i].innerText;
    }
	
	//（2）将所有相同的option内容去掉
	var data={};	
	var desiredArr=new Array();  
	for(var i=0;i<array.length;i++){  
		data[array[i]]=array[i];  
	} 
	
	for(var pro in data){  
	  desiredArr.push(data[pro])  
	}  
	
	//（3）删掉所有子节点
	 var parent = document.getElementById("test2");  
     //这里因为childNodes节点会动态变下标，所以用0的index实现全部删除  
     for (var i = 0, length= parent.childNodes.length; i < length; i++){  
         parent.removeChild(parent.childNodes[0]);  
     } 
	 
	 //（4）添加过滤后的子节点
     for (var i = 0, length= desiredArr.length; i < length; i++){
		 var div_view=document.createElement("option");   
	  	 var text = document.getElementById("test2");  
	     div_view.innerText=desiredArr[i];  
	     text.appendChild(div_view); 
	 }
  }
  </script>
  <body>
	<fieldset>
	<legend>DSAFSD</legend> 
  <textarea rows="10" cols="10" id="test"></textarea>
    This is my JSP page. <br>
    </fieldset>
    <del>dadf</del>
    <select id="testSelect"  οnfοcus="test()" >
				<optgroup label="default" id="test2">
				<option>11</option>
				<option>11</option>
				<option>224</option>
				</optgroup>
    </select>
    
    <textarea rows="10" cols="100" id="testread">testtesttest111</textarea>
  </body>
</html>

tianjun309

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS去掉<select>中重复的<option>

&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"&gt;&lt;html&gt; &lt;head&gt; &lt;title&gt;My JSP 'MyJsp.jsp' starting page&lt;/title&gt; &lt;meta http-equiv="pragma&qu
复制链接

扫一扫