2

かなり単純なポッパーを動作させるのに問題があります。アイデアは、親がポップアップウィンドウを開き、その中にdivを追加する必要があるということです。

コードの関連部分:

parent.html

var childWindow;

function togglePref() {
    childWindow = window.open("popup.html", "prefPopup", "width=200,height=320");
}

function loadPopupElements() {
    var prefElements = document.getElementById("prefBrd").cloneNode(true);

    var childDoc = childWindow.document;

    var childLink = document.createElement("link");
    childLink.setAttribute("href", "pop.css");
    childLink.setAttribute("rel", "stylesheet");
    childLink.setAttribute("type", "text/css");

    childDoc.head.appendChild(childLink);
    childDoc.body.appendChild(prefElements);
}

popup.html

<head>
</head>

<body onload="opener.loadPopupElements();">
</body>

これはSafariとChromeで正常に機能しますが、何らかの理由でIEは何も追加することを拒否します。

4

1 に答える 1

2

わかりました。innerHTMLを使用して、醜い解決策で問題を回避することができました。どうやら、ヘムロックが述べたように、IEは別のドキュメントからの子の追加をサポートしていません。importNode()メソッドを検討することを提案する人もいましたが、私もうまくいかなかったようです。

したがって、回避策は次のようになります。

parent.html

var childWindow;

function togglePref() {
    childWindow = window.open("popup.html", "prefPopup", "width=200,height=320");
}

function loadPopupElements() {
    var prefElements = document.getElementById("prefBrd");
    var childDoc = childWindow.document;
    childDoc.body.innerHTML = prefElements.innerHTML;
}

popup.html

<head>
    <link href="pop.css" rel="stylesheet" type="text/css">
</head>

<body onload="loadElements();">
</body>

<script type="text/javascript">
    function loadElements() {
        opener.loadPopupElements();
    }
</script>

私の場合、 #prefBrdには動的に設定された値を持ついくつかの入力要素が含まれているため、これは非常に厄介な方法のようです。したがって、popup.htmlがそれらを取得するには、loadElementsの最後で少し反復する必要があります。 ()関数。appendChildを使用する必要はありませんでした。

于 2012-11-07T13:04:50.410 に答える