形式瞄準一個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中打開新標籤

回答

相關問題