关闭表单提交时打开的弹出窗口并触发单击父窗口

Question

我有一个父窗口，我在其中使用 window.open() 打开弹出窗口，并且我正在使用 window.opener 方法监视该弹出窗口的返回。我在这里有两个疑问：

1. 在我的弹出窗口中，有一个提交按钮负责表单的提交功能，我想等待提交完成并在提交时关闭此弹出窗口。
2. 当提交表单并关闭弹出窗口时，我正在获取文本框值之一，并在弹出窗口关闭后立即在父窗口中使用该值来自动模拟搜索。

代码：

// parent window handling of information returned from the pop-up window
function HandlePopupResult(value) {
    alert("The field value is: " + value);
    $("input[value='Search']").trigger("click");
}

//pop-up window handling of information to be returned to the parent window on submission
$("#myForm").submit(function() {
    window.opener.HandlePopupResult($("#field").val());
    window.close();
});

所以我的问题是：如何确保提交已完成，以便我在父窗口中触发搜索点击并关闭此弹出窗口？请让我知道。

我终于能够正确地将信息发送回我的父表单，但我只需要确保我的提交完成。关于确保仅在提交成功后触发我的事件的任何建议？

干杯。

Answer 1

这对其他人将来会有帮助。我只需将上面的代码修改为下面给出的代码就可以自己实现这一点：

// parent window handling of information returned from the pop-up window
function HandlePopupResult(value) {
    alert("The field value is: " + value);
    $("input[value='Search']").trigger("click");
}

将表单提交更改为 AJAX post 调用，以确保表单提交已发生，然后执行处理弹出窗口结果的剩余任务，然后关闭弹出窗口。奇迹般有效！

//pop-up window handling of information to be returned to the parent window on submission
$("#myForm").submit(function() {
        $.ajax({
          type: 'POST',
          url: $(this).attr('action'),
          data: $(this).serialize(),
          success: function(data) {
            window.opener.HandlePopupResult($("#field").val());
            window.close();
          }
        });
        return false;
      });