遍历 JQuery 中的嵌套表

发布于 2024-10-04 11:47:31 字数 2115 浏览 2 评论 0原文

需要: 我想将表中的数据转换为逗号分隔值。

问题: 一个表格单元格可以有另一个表格。 (例如,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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

零崎曲识 2024-10-11 11:47:31

您应该重写 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.

关于从前 2024-10-11 11:47:31

包含 $('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"

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文