javascript - 在beforeunload中添加隐藏字段

Question

在我的页面上，我使用的表单在提交时应该获得一些额外的隐藏字段。然而问题是我不知道表单的名称/id 也不知道提交按钮，所以我不能使用 onClick 等函数。因此，当用户尝试离开时，我使用 beforeunload 事件来触发事件页面(这包括提交表单)。我正在使用 document.activeElement 来找出触发事件的原因，如果它是表单/提交，我会将隐藏字段添加到表单中。

将代码简化为这样:

var javascriptData = ['val1','val2','val3']; // usually gets values dynamically and can differ in size
$(window).bind('beforeunload', function(e) {
    var activeForm = document.activeElement.form;
    for(var i = 0; i < javascriptData.length; i++){
        $(activeForm).append('<input type="hidden" name="test-data[]" value="'+javascriptData[i]+'" />');
    }
    return false; // just for debug purposes.
}

代码有效，元素已添加到表单中，但它没有显示在下一页的 $_POST 中。但是，最后一行代码(返回 false)会创建一个弹出窗口，询问我是否要离开页面，如果我留在页面上，请再次按提交按钮，然后然后离开页面并检查 $_POST，那里的字段。我的猜测是 $_POST 的数据是在触发 beforeunload 函数之前收集的。

我的问题是:“有没有办法解决这个问题，以便我可以在 beforeunload 事件中向表单添加隐藏字段？”。

非常感谢您的帮助，提前致谢。

Answer 1

为什么不将其添加到页面上的所有表单中？

$(document).ready(function() {
  $("form").append('<input type="hidden" name="test-data[]" value="test" />');
});