JS将table中的td标签值去重

最新推荐文章于 2023-01-30 15:37:01 发布

FANTASY小先生

最新推荐文章于 2023-01-30 15:37:01 发布

阅读量1.1k

点赞数 1

分类专栏： JAVASCRPT 文章标签： javascript table的TD标签数据去重

本文链接：https://blog.csdn.net/Java_PIZI/article/details/77184065

版权

JAVASCRPT 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

JS 将table中的TD标签值去重

有的时候将ACTION传过来的对象在页面进行遍历,会发现有的值是重复的.

比如数据是这样的

{name:'李磊',age:20}

{name:'李磊',age:21}

{name:'李磊',age:22}

当我们不能采取在后台进行数据处理.我们就可以在jsp页面对数据进行去重.

直接上代码:

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page import="java.util.*"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
 
<%
    
List<String> names = new LinkedList<String>(); // List
names.add("奥斯卡;大健康;奥斯卡");
names.add("王彪;李磊;李磊");
names.add("陈雷;陈雷");
request.setAttribute("names", names); // 添加到request
%>
<html>
  <head>
    <base href="<%=basePath%>"> 
    <title>测试页面</title>
   </head>
   <script type="text/javascript" src="<%=basePath%>/js/jquery/jquery-1.8.3.min.js"></script>   
   <script type="text/javascript" >
   
   
   
   
   
   
   </script>
  <body >
    <table width="100%" border="0" cellpadding="30" cellspacing="10" >
   		<tr >
       		<td align="center"><h1>车型库</h1></td>
       	</tr>
    </table>
    
	<table width="100%" border="1" cellpadding="10" cellspacing="10" id="tableid">
	    <tr>
	        <th>username</th>
	    </tr>
	    <c:forEach var="name" items="<%= names %>" varStatus="status">
    	<tr align="center">
    		<td class="mouse_hover">
    			<c:out value="${name}" />
    			<input type="hidden" name="search" value="${status.last}"/>
    		</td>
    		
    	</tr>	
		</c:forEach>
		
	</table>



  </body>
  <script language="javascript" >   
    function dataUpdate(){     
    	var tableObj = document.getElementById("tableid");
    	//在此处修改i和j的初始值,可指定行和列进行数据去重.
	    for (var i = 0; i < tableObj.rows.length; i++) {    //遍历Table的所有Row
	        for (var j = 0; j < tableObj.rows[i].cells.length; j++) {   //遍历Row中的每一列
	            var value = Trim(tableObj.rows[i].cells[j].innerText);
			    Array.prototype.unique3 = function(){
					 var res = [];
					 var json = {};
					 for(var i = 0; i < this.length; i++){
					 	if(!json[this[i]]){
					   		res.push(this[i]);
					   		json[this[i]] = 1;
					  	}
					 }
					 return res;
				}
			    var arr = value.split(";");
			    tableObj.rows[i].cells[j].innerHTML = arr.unique3();
	        }
	    }
    };  
  
   
   function Trim(str) { 
		str = str.replace(/<\/?.+?>/g,""); 
		str = str.replace(/[\r\n]/g, ""); 
		str = str.replace(/\s+/g, ""); 
		str = str.replace(/^\s*/g,""); 
		str = str.replace(/\s*$/g,""); 
		str = str.replace(/(^\s*)|(\s*$)/g, ""); 
		str = str.replace(/\s/g,"");  
		return str;
	} 
   var els =document.getElementsByName("search");
   for (var i = 0, j = els.length; i < j; i++){
   	if(els[i].value == "true"){
   		dataUpdate(); 
   	}
   }
</script>  
</html>

FANTASY小先生

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS将table中的td标签值去重

JS 将table中的TD标签值去重有的时候将ACTION传过来的对象在页面进行遍历,会发现有的值是重复的.比如数据是这样的{name:'李磊',age:20}{name:'李磊',age:21}{name:'李磊',age:22}当我们不能采取在后台进行数据处理.我们就可以在jsp页面对数据进行去重.直接上代码:<%String path = requ
复制链接

扫一扫