JavaScript表单序列化不起作用

Question

我正在使用完美运行的 onload 事件编辑 HTML 表单标签，

$(function (){
window.onload=function(){
var x = document.getElementsByTagName("form");
for (i = 0; i < x.length; i++) {
  if(x[i].getAttribute("data-reactid") == ".0"){
    x[i].id = "form1";
  }
}
}
});

但是，当我尝试序列化表单 onbeforeunload 时，它为空，我做错了什么？我正在使用 chrome，我相信它不适用于其他浏览器。

 $(function (){
  window.onbeforeunload = function (e) {
    var $k = $('#form1').serialize();
    $.ajax({
      type: "POST",
      url: "MYURL",
      data: { t: Date.now(), u: document.URL, k: $k}
    });
  };
});

HTML

<form class role="form" data-reactid=".0">
<input type="text" placeholder="Name" data-reactid=".0.1.0.1">
<input type="text" placeholder="Last Name" data-reactid=".0.1.0.1">
<button type="submit" data-reactid=".0.3">Submit</button></form>

谢谢！ - 数字

Answer 1

第一个问题是$('#form1') 与表单不匹配，因为它没有 ID。 （可能通过在第一个代码块中为其分配 ID 的代码来缓解）。

第二个问题是，即使有，输入元素也没有名字，所以不能成为成功的控件（也不会包含在序列化数据中）。

第三个问题是离开页面的行为（触发onbeforeunload）会取消Ajax请求。