从 iFrame 中的表单发布到父窗口中的弹出窗口答案

【问题标题】：Post from a form in an iFrame to a popup window in the parent window从 iFrame 中的表单发布到父窗口中的弹出窗口
【发布时间】：2017-10-04 13:38:45
【问题描述】：

我花了一些时间试图解决各种类似的问题，但找不到与我正在寻找的完全匹配的解决方案。

所以我有一个非常基本的表单，其中包含 3 个单选按钮，它们嵌入到另一个页面的 iframe 中。当我单击其中一个单选按钮时，此代码会自动提交响应

<script type='text/javascript'>
$(document).ready(function() { 
$('input[name=rating]').change(function(){
$('form').submit(); });
});
</script>

现在我的表单提交操作如下所示

<form method="POST" action="https://formspree.io/myformspreeurl" target="_parent">

所以这成功地提交了来自 iframe 代码的响应，但在父页面上。

我想要发生的是，选择表单上的一个单选按钮时，它会自动提交，但进入弹出窗口（完成验证码），以便用户不必远离父级页面。

可能还是我把事情复杂化了？

感谢您的帮助，

【问题讨论】：

标签： jquery forms post popup

【解决方案1】：

使用

<form action="" method="post" target="_blank">

这应该会打开一个新页面并将您的数据提交给它。我看到您正在使用 jQuery，因此您可以使用以下方法根据特定的单选按钮选择动态更改目标：

$("form").prop("target", targetValue);

【讨论】：

感谢您的回复。使用 _blank 的问题是当我这样做时，formspree 没有看到“POST”命令。根据我的研究，似乎从 iframe 提交到“_blank”选项卡实际上并没有传递所选信息。 “_parent”确实传递了信息，但不幸的是父页面重定向以完成表单pree验证码，这是我想要避免的。

【解决方案2】：

使用 ajax 动态提交表单，如果我不明白，您不会重新加载父页面。

$.ajax({
     type:'POST',
     url:'https://formspree.io/myformspreeurl',
     data:$('form').serialize(),
     success: function (e){

     //what you want to do after submiting//

     }
});

【讨论】：