Question

尝试仅序列化特定表中的元素，但只有在我执行整个Form

时才会返回结果

在下面的代码中，我想ajax只是tbl2中的元素

<form>
 <input type="text" id="tb1" name="tbl1"/>
  <table name="tbl1">
   <tr><td><input type="text" name="tb2"/></td></tr>
 </table>
 <table name="tbl2">
   <tr><td><input type="text" name="tb3"/></td></tr>
   <tr><td><input type="text" name="tb4"/></td></tr>
 </table>
</form>

代码

var params = $("#tbl2").serialize();

var resp = $.ajax({
    async: false,
    type: "POST",
    url: AppRoot + "webhandlers/postback.ashx",
    data: params
});

Answer 1

首先，<table>不能拥有name属性，即使可以，jQuery ID selector（#）也不匹配。

如果您使用id代替（<table id="tbl2">），它将如下工作：

var params = $("#tbl2 :input").serialize();

:input选择器会选择所有表单元素（此处，#tbl2内），因为serialize()仅适用于这些元素。

请查看我的jsFiddle Demo。

Answer 2

你不能serialize一个表 - 该方法不适用于那种DOM对象，只有表单和表单字段可以被序列化。

如果你真的想做你提出的建议，你需要选择合适的选择器来挑选tbl2的子元素，这些子元素也是表单元素，然后你必须通过它们来序列化每一个手。有人在另一个问题上做了这件事：serialize without a form?

更好的方法可能是禁用所有不在您感兴趣的表中的表单元素 - 您需要一个选择器来选择不是tbl2的子元素的所有表单元素 - - 然后然后序列化表格。禁用的元素将被省略。

Answer 3

您可以使用serializeArray方法，该方法将为您提供输入字段数组，并可与数据一起使用。

var params = $("#tbl2 input").serializeArray();

Answer 4

您可以使用SerializeFromTable JQuery插件序列化任何带有或不带有表单元素的表。
无需用

标签包装表格。
它很简单（其中data-columnTitle是您想要的ur json中的关键字段）：

let tabledata = $("#example1").serializeFromTable({
                  columnNameBy:"data-columnTitle"
                });

有关更多选项，请查看以下链接：serializeFromTable Plugin

从表元素序列化而不是整个表单

4 个答案: