0

ページ上の 1 つの要素を全画面表示に拡大し、元のサイズに縮小できるようにするコードをいくつか書きました。このコードは、ページ上の他の要素の状態を保存し、それらのプロパティを変更して復元することで機能します。この変更はポストバック後も存続する必要があるため、状態の変更を保持するために JSON と非表示の入力要素を使用しようとしています。

問題の要素は、複数の IFRAME 内にネストされています。したがって、要素が存在するドキュメント モデルを保存する必要があります。ただし、これにより JSON 変換が停止します。JSON に簡単に変換して元に戻すことができるこの問題を解決する方法が必要です。

関連するコードは次のとおりです。

// e.uniqueID : A unique identifer for the object.
// e.doc: The document model to which the element belongs (so we can find it later).
// e.style: The original style of the element.

function my_preserveElement(gn,elem)
{
    if (elem == null) return;
    if (elem.style == null) return;
    if (elem.id == '') elem.id = PseudoGuid.GetNew();
    var e = new Object();
    e.uniqueID = elem.id;
    e.doc = elem.document;
    var cssString;
    cssString = elem.style.cssText;
    if( typeof(cssString) != 'string' ) { cssString = elem.getAttribute('style'); }
    e.style = cssString;
    me_aObjectStore[gn][me_aObjectStore[gn].length] = e;
}

function my_restoreElements(gn)
{
    for (i = 0; i < me_aObjectStore[gn].length; i++)
    {
        var e = me_aObjectStore[gn][i];
        var elem = e.doc.getElementById(e.uniqueID);
        elem.style.cssText = e.style;
        elem.setAttribute('style',e.style);
    }
    me_aObjectStore[gn] = null;
}
4

1 に答える 1

0

問題のコードは最も内側のフレームで実行されているため、フレーム ツリーをたどり、各レベルの各要素を ID で検索するだけでよいことがわかりました。復元機能は次のようになり、各要素の場所 (一意の ID のみ) を追跡する必要はありません。

function my_restoreElements(gn)
{
    for (i = 0; i < my_aObjectStore[gn].length; i++)
    {
        var e = my_aObjectStore[gn][i];

        // Find the element in this window or one of its parents.
        // Because we need to check the top level frame and w.parent == w.self for that frame, 
        // we use the number of counts to keep the loop from being endless.
        var w = window;
        var elem = null;
        var count = 0; 
        do {
            elem = w.document.getElementById(e.uniqueID);
            w = w.parent; 
            count++;
        } while ((elem == null) && (count < 3))
        if (elem != null) {
            elem.style.cssText = e.style;
            elem.setAttribute('style',e.style);
        }
    } //for
    my_aObjectStore[gn] = null;
}

明示的に 3 レベルだけ上に移動することに注意してください。これは、私の特定のケースでは、フレームの深さが数レベルあるためです。このソリューションを使用できる他のアプリケーションでは、より深い深度が必要になる場合があります。

于 2013-05-03T19:26:47.740 に答える