0

iframe 内にロードするページがあります。そのページには、フォームと同じページ内の iframe にターゲットが設定されている 2 つのファイル入力タグを持つフォーム要素があります。フォームが送信されると、ファイルが JSP ページに送信されます。JSP ページは、処理後に fileupload が返され、アップロードが完了したことをユーザーに通知する JavaScript を書き出し、他の処理を実行します。FF と Chrome では、この設定は問題なく機能しますが、何らかの理由で IE では、iframe 内にフォーム アクションをロードする代わりに、新しいウィンドウがポップアップします。

以下の JavaScript を使用して、最初の iframe に読み込まれるページの DOM に、フォーム、入力、および iframe を挿入します。

var containerDiv = document.createElement('div');
containerDiv.setAttribute("id", "containerDiv");
containerDiv.style.position = "absolute";
containerDiv.style.top = "360px";
containerDiv.style.left = "20px";
containerDiv.style.width = "300px"

var iFrame = document.createElement('iframe');
iFrame.setAttribute("id", "target-iframe");
iFrame.name = "target-iframe";
iFrame.style.visibility = "hidden";
iFrame.style.height = "50px";

var zipInput = document.createElement('input');
zipInput.setAttribute("type", "file");
zipInput.setAttribute("id", "zipInput");
zipInput.setAttribute("name", "test");
zipInput.setAttribute("title", "Test");
zipInput.style.marginBottom = "10px";

var pdfInput = document.createElement('input');
pdfInput.setAttribute("type", "file");
pdfInput.setAttribute("id", "pdfInput");
pdfInput.setAttribute("name", "test");
pdfInput.setAttribute("title", "Test");

var form = document.createElement('form');
form.setAttribute("id", "uploadForm");
form.setAttribute("enctype", "multipart/form-data");
form.setAttribute("action", "http://servername:8090/xmlserver/jsp/Upload.jsp?BatchID=" + CSForm.getField("BatchID").getValue());
form.setAttribute("method", "POST");

document.getElementById("DFS__pagediv1").appendChild(containerDiv);
document.getElementById("containerDiv").appendChild(form);
document.getElementById("containerDiv").appendChild(iFrame);
document.getElementById("uploadForm").appendChild(zipInput);
document.getElementById("uploadForm").appendChild(pdfInput);

以下のコードに従ってフォーム ターゲットを iframe 名に設定しましたが、それでも IE の新しいウィンドウがポップアップします。

document.getElementById('uploadForm').target = document.getElementById("target-iframe").name;
alert(document.getElementById('uploadForm').target);
document.getElementById('target-iframe').style.visibility="Visible";
document.getElementById("uploadForm").submit();

それが私が見逃している基本的なものであることを願っています。助けや回避策があれば本当に感謝しています。

前もって感謝します!

4

1 に答える 1

0

この問題を解決するために、次のコードのバリエーションを使用しました。どうやらIEでiFrameに名前を付けても、実際にはiFrameに名前が付けられていません。

var iFrameID  = 'ID1';
var myIFrame = document.createElement('iframe');

myIFrame.setAttribute('src', 'about:blank');
myIFrame.setAttribute('id', iFrameID);
myIFrame.setAttribute('NAME', iFrameID);
myIFrame.style.display = 'none';
document.body.appendChild(myIFrame);
if((onReadyFunction) && (typeof(onReadyFunction) == 'function'))  captureEvent('load', function(){ var iFrame = document.getElementById(iFrameID); var doc = (iFrame.contentDocument)?(iFrame.contentDocument):((iFrame.contentWindow)?(iFrame.contentWindow.document):(self.frames[iFrameID].document)); if (doc.location.href == 'about:blank') { return; } else { onReadyFunction(doc.body.innerHTML); } }, myIFrame);
[B]if(self.frames[iFrameID].name != iFrameID) { /* *** IMPORTANT: This is a BUG FIX for Internet Explorer *** */ self.frames[iFrameID].name = iFrameID; }[/B]
于 2013-02-08T20:45:24.017 に答える