jquery 遍历 table 行，获取数据并将其存储在变量中，并将所有数据输出为数组

Question

我正在尝试构建 jQuery 函数，但还没有完成。

我试图遍历每个 table 行，获取数据并将每行值编译成一个不可用的数组。然后将数组输出到文本区域。

我的想法是这样我就可以将数组复制并粘贴到一个新的文本框中，然后开始一个新的挑战来制作一个 jQuery 函数来将该数组数据输入回我的 html table.

如果您能想到更好的方式来描述我的问题，请随时重命名此问题。

这就是我的进展...

参见fiddle：http://jsfiddle.net/6cqycyn6/7/

var data = null,
    $results = $('.acf-field[data-name="report_results"] .acf-repeater TABLE TR.acf-row');

$("A#data_get").click(function () {

    $results.each(function () {

        var data = array(
            row = $('.order').html();
            report_results_position = $('.acf-field[data-name="report_results_position"]').find('INPUT[type="number"]').val();    
            report_results_rider = $('.acf-field[data-name="report_results_rider"]').find("SELECT OPTION:selected").text();
            report_results_L1 = $('.acf-field[data-name="report_results_L1"]').find('INPUT[type="text"]').val();
            report_results_L2 = $('.acf-field[data-name="report_results_L2"]').find('INPUT[type="text"]').val();
            report_results_L3 = $('.acf-field[data-name="report_results_L3"]').find('INPUT[type="text"]').val();
            report_results_T3 = $('.acf-field[data-name="report_results_T3"]').find('INPUT[type="text"]').val();
            report_results_time = $('.acf-field[data-name="report_results_time"]').find('INPUT[type="text"]').val();
            report_dnf_dsq = $('.acf-field[data-name="report_dnf_dsq"]')".find('input[type='checkbox']").val();
        );

    });

    $("TEXTAREA.clipboard").html(data);

});

我什至无法让数组出现在文本框中。

并且通过查看我的代码，我猜数组无论如何都只是最后一行。如何以可用的键控格式将每一行存储在数组中。

哪位jquery高手帮忙不胜感激

参见fiddle：http://jsfiddle.net/6cqycyn6/7/

Answer 1

首先，尝试清理您的标记，简化您的选择器并修复您的语法错误。检查控制台中显示的错误。这会让事情变得容易得多。

此外，您必须在 $.each() 函数中添加 $(this) 以仅引用一行和实际行，否则每个数据都会被存储。

row = $(this).find('.order').html();

要启动一个空数组写入：

var data = [];

要将您的数据分别存储在一个数组中，您可以尝试一个对象：

data.push(
        {
            'row' : row,
            'report_results_position' : report_results_position,
            'report_results_rider': report_results_rider,
            'report_results_L1' : report_results_L1,
            'report_results_L2' : report_results_L2,
            'report_results_L3' : report_results_L3,
            'report_results_T3': report_results_T3, 
            'report_results_time' : report_results_time,
            'report_dnf_dsq' : report_dnf_dsq
        }
    );

尝试 console.log(data); 检查您的数据数组。

要访问您的数据，请使用：

data[index].key

index = 数组索引（从 0 开始）

key = 数据数组中对象键的名称

例如 data[0].report_results_rider 将输出 "Marc Marquez"

如果你想在文本区域中显示你的数组，你可以使用：

html_data = JSON.stringify(data);
$("textarea.clipboard").html(html_data);

Demo

参考

.push()

.stringify()

jquery 遍历 table 行，获取数据并将其存储在变量中，并将所有数据输出为数组

jquery loop through table rows, get and store data in variables and output all the data as an array

arrays

jquery

loops

html-table