遍历 JQuery 中的嵌套表
需要: 我想将表中的数据转换为逗号分隔值。
问题: 一个表格单元格可以有另一个表格。 (例如,Row1、Cell 3 包含一个表)该脚本需要针对嵌套表运行并仅捕获该列一次。这里它捕获“Col 3”两次。 嵌套表的数量未知。 它应该是一个通用脚本。
谢谢。
我的 HTML 文件:
<html>
<head>
<script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery.table2csv.0.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function() {
jQuery("#tableone").table2csv({
callback: function (csv) {
//alert(csv);
}
});
});
</script>
</head>
<body>
<table id="tableone" style="width:100%;">
<tbody>
<tr>
<td>
<div >
Col 1
</div>
</td>
<td >
<div >
Col 2
</div>
</td>
<td >
<div >
<table >
<tbody>
<tr>
<td >
Col 3
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<tr >
<td >
<div >
Data in Col 1
</div>
</td>
<td >
<div >
Data in Col 2
</div>
</td>
<td >
<div >
Data in Col 3
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>
jquery.table2csv.0.1.1.min.js
(function($)
{$.fn.table2csv=function(options)
{
var defaults=
{
delimiter:",",callback:function(csv)
{
return csv;
}
};
var settings=$.extend(defaults,options);
return this.each(function()
{
var name=$(this).find("caption").text();
var csv="";
$(this).find("td").each(function()
{
csv+="\""+$(this).text().replace(/(\")/gim,"\\\"\\\"")+"\""+",";
alert(csv);
})
csv=csv.replace(/\,$/gim,"");
settings.callback(csv,name);
});
}
})(jQuery);
Need:
I want to convert the data in my table into a comma separated value.
Problem:
A table cell may have another table. (e.g. Row1, Cell 3 contains a table) The script needs to run for nested tables and capture the column only once. Here it is capturing "Col 3" twice.
The number of nested tables is not known.
It should be a generic script.
Thank you.
my HTML file:
<html>
<head>
<script src="http://code.jquery.com/jquery-1.4.4.min.js" type="text/javascript"></script>
<script src="jquery.table2csv.0.1.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(function() {
jQuery("#tableone").table2csv({
callback: function (csv) {
//alert(csv);
}
});
});
</script>
</head>
<body>
<table id="tableone" style="width:100%;">
<tbody>
<tr>
<td>
<div >
Col 1
</div>
</td>
<td >
<div >
Col 2
</div>
</td>
<td >
<div >
<table >
<tbody>
<tr>
<td >
Col 3
</td>
</tr>
</tbody>
</table>
</div>
</td>
</tr>
<tr >
<td >
<div >
Data in Col 1
</div>
</td>
<td >
<div >
Data in Col 2
</div>
</td>
<td >
<div >
Data in Col 3
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>
jquery.table2csv.0.1.1.min.js
(function($)
{$.fn.table2csv=function(options)
{
var defaults=
{
delimiter:",",callback:function(csv)
{
return csv;
}
};
var settings=$.extend(defaults,options);
return this.each(function()
{
var name=$(this).find("caption").text();
var csv="";
$(this).find("td").each(function()
{
csv+="\""+$(this).text().replace(/(\")/gim,"\\\"\\\"")+"\""+",";
alert(csv);
})
csv=csv.replace(/\,$/gim,"");
settings.callback(csv,name);
});
}
})(jQuery);
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您应该重写 table2csv 脚本;您可以使用 $('tr').children('td') 来确保获取给定行的单元格,而不是使用 $().find('td') 来定位 。
请注意随机 网络上可能包含
You should rewrite the table2csv script; instead of using $().find('td') to locate <td>s, you could use $('tr').children('td') to make sure you are getting the cells of given row.
Beware that a random <table> on the web might contain <th> <tbody> <tfoot> and other semantic stuff.
包含 $('tr').children('td') 后
我们得到的o/p为
“col1”,“col2”,“col3”,“col3”,“col1中的数据”,“col2中的数据”,“col3中的数据”
"col1","col2","col3","col3","col1 中的数据","col2 中的数据","col3 中的数据"
"col1","col2","col3","col3","data in col1","data in col2","data in col3"
但输出应该是
"col1","col2","col3","col1 中的数据","col2 中的数据","col3 中的数据"
after including $('tr').children('td')
the o/p we get as
"col1","col2","col3","col3","data in col1","data in col2","data in col3"
"col1","col2","col3","col3","data in col1","data in col2","data in col3"
"col1","col2","col3","col3","data in col1","data in col2","data in col3"
but the output should be
"col1","col2","col3","data in col1","data in col2","data in col3"