如何将 html 表格输入文本值传达给 JSON？答案

【问题标题】：how to convey html table input text value to JSON?如何将 html 表格输入文本值传达给 JSON？
【发布时间】：2014-02-10 09:58:28
【问题描述】：

我已经创建了这种方法来将 html 表格输入文本值转换为 json 但没有用，有人可以帮我吗？我的 json 值为空 []

<table id="address_table" class="table" runat="server">
  <thead>
    <tr>
      <th>Street</th>
      <th>City</th>
      <th>Province</th>
      <th>PostalCode</th>
      <th>&nbsp;</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <input type="text" name="street_01" maxlength="255" required /></td>
      <td>
        <input type="text" name="city_01" maxlength="255" required  /></td>
      <td>
        <input type="text" name="province_01" maxlength="255" required  /></td>
      <td>
        <input type="text" name="postalCode_01" maxlength="7" required  /></td>
      <td>&nbsp;</td>
    </tr>
  </tbody>
</table>

javascript

//get data from te
$("#btnAddPerson").bind("click", function() {
  var AddressesDataJSON = $("#address_table").serializeArray();
  console.log(AddressesDataJSON);
  alert(JSON.stringify(AddressesDataJSON));
});

【问题讨论】：

fiddle
表格中没有数据:(

标签： jquery json html-table

【解决方案1】：

您应该在form 元素或表单控件上调用serializeArray。

$("#address_table").find('input').serializeArray();

http://jsfiddle.net/9Z8KX/

【讨论】：

【解决方案2】：

serializeArray 应该用在表单上。您可以将输入包装在一个表单中，它会起作用。这是一个例子。 http://jsfiddle.net/pLQ2L/1/

<form>
<table id="address_table" class="table" runat="server">
  <thead>
    <tr>
      <th>Street</th>
      <th>City</th>
      <th>Province</th>
      <th>PostalCode</th>
      <th>&nbsp;</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <input type="text" name="street_01" maxlength="255" required /></td>
      <td>
        <input type="text" name="city_01" maxlength="255" required  /></td>
      <td>
        <input type="text" name="province_01" maxlength="255" required  /></td>
      <td>
        <input type="text" name="postalCode_01" maxlength="7" required  /></td>
      <td>&nbsp;</td>
    </tr>
  </tbody>
</table>
</form>

【讨论】：