Question

我通过Ajax请求HTML页面。

该页面包含<table id="studentsTable" ..，我希望使用tableToJSON()函数转换为JSON：

    $.ajax({ url:'https://domain.org/en/courses/1226/course_applications', 
  success: function(data) { 

      var $html = $(data);
      var $table = $html.find('#studentsTable').parent();
      console.log($table.html()); //This prints correctly the <table>..contents..</table>

      var tableJ = $table.tableToJSON();
      console.log(tableJ);  //This prints Array[0] !!
      }
    });

我正在执行parent()事情，因为如果没有，<table>和</table>标签会被切断。

我的问题是我是jQuery的新手，显然我在调用时做错了 tableToJSON()

目标是，如下表所示：

<table border="1" id="studentsTable">
<thead>
    <tr>
        <th>Name</th>
        <th>Surname</th>
        <th>Age</th>
        <th>Gender</th>
        <th>Old</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>John</td>
        <td>Smith</td>
        <td>40</td>
        <td>M</td>
        <td>N</td>
    </tr>
    <tr>
        <td>Clare</td>
        <td>Lander</td>
        <td>34</td>
        <td>F</td>
        <td>Y</td>
    </tr>
</tbody>

以获取JSON对象形状如此（用于Chrome扩展程序中的进一步处理 - 但这将是一个不同的问题 - ;）

[
{
    "Name": "John",
    "Surname": "Smith",
    "Age": "40",
    "Gender": "M",
    "Old": "N"
},
{
    "Name": "Clare",
    "Surname": "Lander",
    "Age": "34",
    "Gender": "F",
    "Old": "Y"
}
]

提前感谢您的耐心和宽容！

Answer 1

虽然tableToJSON必须是某种自定义函数或插件（不是标准jQuery），但很难确定，但我认为答案很简单：

var $table =  $html.find('#studentsTable');

使用.parent()将获得它上面的任何元素，它不会是一个表格。我怀疑如果你把一些不是表格的东西送到“tableToJSON”方法，那么它就会失败。

执行console.log($table.html());时无法看到“table”标签的原因是因为.html()方法仅打印所选元素的内部HTML - 请参阅{}文档中的示例{3}}。我怀疑这会误导你把错误的元素传递给你的函数。

Answer 2

最后，在经过多次尝试后，我在this other SO answer中找到了溶剂，我在此处复制并粘贴 why 。正如@Buzinas所说：

它不起作用，可能是因为tableToJSON需要的元素放在文档内部才能工作。您必须临时将表附加到文档才能获取JSON，并在生成json后立即将其删除。

不知怎的，我知道，所以我在尝试这样的事情

var table= $('#studentsTable', $(data)).tableToJSON();

希望为tableToJSON提供一个不同的context，但是没有用（我不知道为什么）。
我也敢于在jquery.tabletojson.js源代码中编辑IIFE tableToJSON函数，但又一次变得疯狂.. 现在好，我可以继续前进！

AJAX＆amp; JSON：将tableToJSON（）应用于通过ajax接收的数据

2 个答案: