1

私は次のstackoverflowの質問と回答を見つけて使用しています。親ドメインに自分の身長を伝えるために、親ドメインを参照するiFrame内のiFrameを使用しています。私はその概念を完全に理解しており、これをかなり簡単に実装できました。問題は、jQueryから$（document）.height（）を取得しようとすると、またはdocument.body.scrollHeightだけで取得しようとすると、ページがiFrame内で参照されているときに、すべてのブラウザーで奇妙な結果が表示されることです。

これが私のページで起こっていることの背景です。サードパーティプロバイダーのサービスを検索するためにいくつかのajax呼び出しを行い、その結果に基づいてページ内にhtmlを生成しています。これはかなり標準的なものです。ちなみに、ドキュメントの高さを取得する前に、HTMLがDOMに追加されるのを待っています。これが私のページがiFrame内にあるときの$（document）.height（）の結果です。

ピックアップされた高さがドキュメントの実際の高さよりもほぼ1000ピクセル以上小さいFireFox10.0.2。

Google Chrome 18.0.1025.162は、ほとんどの場合、正しい高さを取得します。高さが数百ピクセルだけ小さい場合があります。

Safari5もFireFoxと同じように動作します。

動作を示すコードを含む多くのブログ投稿を見てきました。jQueryを使用するか、javascriptドキュメントオブジェクトで何を使用できるかは関係ありません。これらの呼び出しのいずれかから、一貫性のない結果が返されるのを常に見ています。このテクニックを使った他の人たちがこれに出くわしたと私は信じなければなりません。

iFrameのサイズ変更またはヘルパーiFrameのコードは期待どおりに機能しているため、これらを表示する必要はありません。私が示したい主なコードは、ajaxイベントとdom操作が終了した後、検索フォームからサイズ変更プロセスを開始する方法です。

function resizeMe() {
    var iFrameHelper = $("#iFrameHelper");
    iFrameHelper.attr("src", iFrameHelper.attr("data-url") + "?height=" + $(document).height() + "&cacheb=" + Math.random());
}
4

1 に答える 1

0

だから私は問題が何であるかを理解することになった。$（document）.height（）の部分は正しく機能していました。問題はすべてタイミングに関するものです。ajax呼び出しが完了した後にページにレンダリングするアイテムには、画像を取得するためにページからリクエストが送信される原因となる画像が含まれています。画像にデフォルトの高さが設定されていなかったため、ページ内のiFrameのsrc属性を変更する前に高さが正しく計算されていませんでした。これにより、親のサイズ変更が開始されます。

私がやったことは、すべての画像が同じ寸法を共有しているため、すべての画像の高さをデフォルトにすることでした。私は自分の代わりにiFrameを非難していました。そんな単純な理由で2日間髪を抜いた。

これが将来誰か他の人に役立つことを願っています。

于 2012-05-25T15:05:32.047 に答える