形式瞄准一个iframe在Chrome中打开新标签

我想提交一个表单到一个iframe，这两个都是在我的项目中使用javascript动态构建的。形式瞄准一个iframe在Chrome中打开新标签

<script> 
document.querySelector('iframe').setAttribute('id', iframeId); 
document.getElementById(iframeId).setAttribute('name', target); 
document.getElementById(iframeId).setAttribute('width', width); 
document.getElementById(iframeId).setAttribute('height', height); 

document.querySelector('form').setAttribute('id', id); 
document.getElementById(id).setAttribute('target', target); 
document.getElementById(id).setAttribute('action', actionURL); 

document.getElementById(id).submit(); 
<script>

这就是它在浏览器Web Inspector中稍后的样子。

<iframe id="my_frame" name="my_frame" width="700" height="400"> 
     <p>Your browser does not support iframes.</p> 
</iframe> 

<form id="my_form" target="my_frame" action="http://localhost:8080/MyProject/loadService" method="POST" style="display: none;"> 
    <input type="hidden" name="userId"/> 
    <input type="hidden" name="locale"/> 
</form>

这对我来说很适合Firefox，但是在Chrome中它会打开一个新标签。我尝试了解决方案here但它没有解决问题。任何人都可以请建议缺少什么？

来源

2017-04-22 stefan_persie

从您的HTML内嵌框架和尝试做这样的：

//Create the iframe, set its attributes and append it before the form 
var iframe = document.createElement('iframe'); 
iframe.name = 'my_frame'; 
iframe.id = 'my_frame'; 
iframe.width = '400'; 
iframe.height = '700'; 
var form_element = document.getElementById('my_form'); 
form_element.parentNode.insertBefore(iframe, form_element); 

//Submit form to iframe 
document.getElementById('my_form').submit();

来源

2017-04-25 08:58:48

@jeremypress的回答也非常有帮助，但这更详尽。谢谢！ –

This post建议在提交表单前动态添加表单的target-attribute。

由于您正在创建两个 - 表单和iframe - 动态，您是否尝试创建并添加iframe到表单之前的DOM？也许target-id必须存在于表单创建时间才能正常工作。

来源

2017-04-22 15:18:23 anty

我创建的窗体和iframe。我所做的只是设置表单属性，例如动态url，target，id和iframe属性，例如名称和id动态地从服务器获取，然后提交表单。已更新我的问题 –

我有同样的问题。我跟着this的帖子为我修好了。尝试动态生成iframe，并确保在将iframe附加到DOM之前设置将由表单定位的名称/ id。

例如：

iframe = document.createElement('iframe'); 
iframe.name = 'target_name'; 
iframe.id = 'target_name'; 

// now append to DOM, ideally to a container element 
document.body.appendChild(iframe);

来源

2017-04-24 20:38:36 jeremypress

形式瞄准一个iframe在Chrome中打开新标签

回答

相关问题