javascript - 如何通过jQuery序列化div标签的子元素？

Question

我使用 jQuery 和 ajax。

在第一个。这是我的 html。

<form id="frm" name='frm' action="." method="post">
  <div style="position: absolute; top:270px;">
  <div id='mybuttons'>
    <input type="submit" class="buttonbig3" name="btn1" value="1" /><br />
    <input type="submit" class="buttonbig3" name="btn2" value="2" /><br />
  </div>
  <input id="hidden-qid" type="hidden" name="set" value="hoge" />
  </div>
</form>

并且，我在 JS 中创建了如下提交函数。

  $('#frm').submit(function() {
var serialized_date = $('form#frm').serialize();
console.log(serialized_date);

但是，“console.log”记录了“set”参数。但是，btn1或btn2无法显示日志。

我猜它是 mybuttons div 标签的子级。

我不想删除该标签。因为，我通过 javascript 动态创建 html。

$('#mybuttons').innerHTML = "<input type="\submit\" class="\buttonbig3\" name=\"btn1\" value=\"1\" /><br />";

你能告诉我如何序列化子标签吗？

Answer 1

我希望对您有所帮助，只需找到提交并添加到序列化的按钮即可

$('#frm').submit(function() {
  var serialized_date = $('form#frm').serialize();
  var btn = $(document.activeElement);
  serialized_date += "&" + btn.attr("name") + "=" + btn.val();
  console.log(serialized_date);
});

<script src="http://gh-canon.github.io/stack-snippet-console/console.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="frm" name='frm' action="." method="post">
  <div id='mybuttons'>
    <input type="submit" class="buttonbig3" name="btn1" value="1" /><br />
    <input type="submit" class="buttonbig3" name="btn2" value="2" /><br />
  </div>
  <input id="hidden-qid" type="hidden" name="set" value="hoge" />
</form>