怎样用jquery取出表格中的数据

Question

以下是table中的一行数据，需要将以下关键信息提取，以便将数据组合成一个数组给后台
1.第一列1，用来表示步骤1:
2.第二列btn-group-toggle，取选中的单选按钮中的值
3.第三列及后继类推
为了方便提取，可以添加id等

<tbody>
                <tr>
                    <td><span>1</span></td>
                    <td>
                        <div class="btn-group btn-group-toggle" data-toggle="buttons">
                            <label class="btn btn-info">
                                <input type="radio" name="options" id="step_opt_1" autocomplete="off"> Start at
                                <input type="text" />
                            </label>
                            <label class="btn btn-info">
                                <input type="radio" name="options" id="step_opt_1" autocomplete="off" checked="checked"> Wait(min)
                                <input type="text" />
                            </label>
                        </div>
                    </td>
                    <td><input type="button" value="Auto" /></td>
                    <td><input type="text" placeholder="0" /></td>
                    <td><input type="text" placeholder="0" /></td>
                    <td><input type="text" placeholder="0" /></td>               
                </tr>       
            </tbody>

Answer 1

以下回复参考：皆我百晓生、券券喵儿等免费微信小程序作答:

你可以使用jQuery选择器配合 .each() 函数来遍历表格的行，然后使用 .text() 或 .val() 函数来获取每个单元格的数据。以下是一个简单的例子，它将提取第一列和第二列的数据，以及所有后续列的输入值。对于单选按钮的值，你需要通过点击事件或使用jQuery的:checked选择器来获取选中的值。注意，你需要适当地修改此代码以适应你的具体情况和需求。

假设你想将所有提取的数据存储在一个数组中并发送到后台，你可以这样做：

var dataArray = []; // 用于存储数据的数组

$('tbody tr').each(function() { // 遍历表格的每一行
    var item = {}; // 用于存储当前行的数据
    var firstCellValue = $(this).find('td:eq(0)').text(); // 获取第一列的值
    var secondCellValue = $(this).find('.btn-group-toggle input:checked').val(); // 获取第二列选中的单选按钮的值
    item['firstColumn'] = firstCellValue; // 将第一列的值添加到对象中
    item['secondColumn'] = secondCellValue; // 将第二列的值添加到对象中
    // 获取后续列的输入值并添加到对象中...
    var otherColumnsValues = []; // 存储后续列的输入值
    $(this).find('td:gt(1)').each(function() { // 遍历后续的单元格
        otherColumnsValues.push($(this).find('input').val()); // 获取每个单元格的输入值并添加到数组中
    });
    item['otherColumns'] = otherColumnsValues; // 将所有后续列的值添加到对象中
    dataArray.push(item); // 将当前行的数据添加到数组中
});

请注意，这段代码假定你的HTML结构和CSS类与你的示例一致。你可能需要调整选择器以匹配你的具体页面结构。另外，如果你需要从后台接收这个数组，你可能需要使用AJAX或其他方法来发送这个数组到你的服务器。你可以使用jQuery的 .ajax() 函数来完成这个任务。