将HTML表数据存储到Javascript数组中

我试图将表数据存储到Javascript数组中，并将数组发送到php

<div>
  <h5>PUT SOMETHING 1</h5>
  <input type="text" id="sample1" palceholder="SOMETHING" required>
</div>
<div>
  <h5>PUT SOMETHING 2</h5>
  <input type="text" id="sample2" palceholder="SOMETHING" required>
</div>
<div>
  <h5>PUT SOMETHING 3</h5>
  <input type="text" id="sample3" palceholder="SOMETHING" required>
</div>
<div>
  <button style="margin-top: 20px;" type="button" onclick="output();">OUTPUT</button>
</div>
<div style="margin-top: 10px;">
  <table class="table table-striped projects" id="table">
    <thead>
      <tr>
        <th>sample1</th>
        <th>sample2</th>
        <th>sample3</th>
      </tr>
    </thead>
    <tbody>
    </tbody>
  </table>
</div>
<div>
  <button type="button" onclick="submit();">SUBMIT</button>
</div>

放点东西
放点东西
放点东西
输出
样本1
样本2
样本3
提交

这是我的剧本

function delete_row(r) {
  var result = confirm("Are you sure? Delete row from order?");
  if (result) {
    var i = r.parentNode.parentNode.rowIndex;
    document.getElementById("table").deleteRow(i);
  }//if(result)
}//delete_row();

function output() {
  var sample1 = document.getElementById("sample1").value;
  var sample2 = document.getElementById("sample2").value;
  var sample3 = document.getElementById("sample3").value;

  var table = document.getElementById("table");
  var row = table.insertRow(table).outerHTML = "<tr id='row'><td>" + sample1 
            + "</td><td>" + sample2 + "</td><td>" + sample3 +
            "</td><td> <a href='#' onclick='delete_row(this)'>Remove </a></td></tr>";
}//output();

function submit() {
  //Store HTML Table Values into Multidimensional Javascript Array Object
  var TableData = new Array();
  $('#table tr').each(function(row, tr) {
    TableData[row] = {
      "sample1": $(tr).find('td:eq(0)').text(),
      "sample2": $(tr).find('td:eq(1)').text(),
      "sample3": $(tr).find('td:eq(2)').text()
    }//tableData[row]
  });
  TableData.shift(); // first row will be empty - so remove

  alert(TableData);

  var Data;
  Data = $.toJSON(TableData);

  $.ajax({
    type: "POST",
    url: "getInfo.php",
    data: "pTableData=" + TableData,
    success: function(msg) {
        //return value stored in msg variable "success";
    }//success
  });
}//submit();

函数删除_行（r）{
var result=confirm（“是否确定？从订单中删除行？”）；
如果（结果）{
var i=r.parentNode.parentNode.rowIndex；
document.getElementById（“表”）.deleteRow（i）；
}//如果（结果）
}//删除_行（）；
函数输出（）{
var sample1=document.getElementById（“sample1”）.value；
var sample2=document.getElementById（“sample2”）.value；
var sample3=document.getElementById（“sample3”）.value；
var table=document.getElementById（“表格”）；
var row=表格.insertRow（表格）.outerHTML=“”+样本1
+“”+样本2+“”+样本3+
" ";
}//输出（）；
函数提交（）{
//将HTML表值存储到多维Javascript数组对象中
var TableData=新数组（）；
$（'#表tr'）。每个（函数（行，tr）{
TableData[行]={
“sample1:$（tr）.find（'td:eq（0）'）.text（），
“sample2”：$（tr）.find（'td:eq（1）'）.text（），
“sample3”：$（tr.find（'td:eq（2）'）.text（）
}//tableData[行]
});
TableData.shift（）；//第一行将为空-因此删除
警报（表格数据）；
var数据；
数据=$.toJSON（TableData）；
$.ajax({
类型：“POST”，
url:“getInfo.php”，
数据：“pTableData=“+TableData，
成功：功能（msg）{
//存储在msg变量“success”中的返回值；
}//成功
});
}//提交（）；

我的php

<?php
  // Unescape the string values in the JSON array
  $tableData = stripcslashes($_POST['pTableData']);

  // Decode the JSON array
  $tableData = json_decode($tableData,TRUE);

  // now $tableData can be accessed like a PHP array
  echo $tableData[1]['sample1'];
?>

submit函数对我不起作用，即使我删除了$.ajax，警报（TableData）也不会显示。因此，我无法验证我的php代码和存储html表数据是否正确，请您看看我的提交函数和php代码，看看哪里出错了

---

提前感谢您。

尝试更改向此站点发送邮件数据的方式：

data: { pTableData: TableData},

---

您是否尝试查看控制台中的异常？如果警报不起作用，这意味着之前有东西崩溃了。你的函数

}

没有正确结束除了我正在使用的方法之外，还有其他方法存储html表数据吗？在我发出警报以查看数据的同时，试着这样做。在JSFIDLE中，警报完全起作用，但当我试图将其复制到代码中时，警报未显示，我不知道原因，也不知道问题出在哪里，我还尝试将您的代码放入另一个文件中，警报仍不显示。请检查您的浏览器控制台是否存在任何错误。您也可以与我共享快照。如果您觉得我正在试图解决您的问题，请告诉我您的声誉，它说“未捕获的引用错误：$未定义”非常感谢您的帮助$（'#table tr'）。每个（函数（行，tr）{这是错误开始的地方

function submit() {
  //Store HTML Table Values into Multidimensional Javascript Array Object
  var TableData = new Array();
  $('#table tr').each(function(row, tr) {
    TableData[row] = {
      "sample1": $(tr).find('td:eq(0)').text(),
      "sample2": $(tr).find('td:eq(1)').text(),
      "sample3": $(tr).find('td:eq(2)').text()
    }//tableData[row]
  });
  TableData.shift(); // first row will be empty - so remove

  alert(TableData);


 var Data;
  Data = JSON.stringify(TableData);
alert(Data);
  $.ajax({
    type: "POST",
    url: "getInfo.php",
    data: "pTableData=" + Data,
    success: function(msg) {
        return value stored in msg variable "success";
    }//success
  });
};//submit();`enter code here`