3

さて、最初にいくつかの背景情報：私は別のページ内にウェブページを埋め込もうとしています。サブページは基本的に、javascriptとhtmlで記述された小さなWebアプリケーションであり、入力のいくつかの画面（ラジオボタン、テキストボックスなど）を受け取り、最後に結果を表示する画面を表示します。これらの画面はそれぞれ異なるサイズにすることができます。

埋め込みを行うために使用しようとした2つの方法があります。

1）すべてのhtmlとjavascriptをサブページからメインページにコピーし、div / table/whateverに貼り付けます。

2）サブページを独自のファイルに保持し、embed / object/iframeを使用して埋め込みます。

最初の方法を使用すると、ページは正常に動作します。唯一の本当の問題は（一種の厄介な解決策であることを除いて）、私が埋め込んでいるサブページが実際には外部アプリケーションによって生成され、ページが新しいバージョンに置き換えられることがよくあるということです。これは多かれ少なかれ、長期的な解決策として最初の方法を使用することを除外します。

現在、2番目の方法には独自の問題があります。埋め込まれたJavaScriptページの高さが変わるため、それを保持しているフレームのサイズもそれに合わせて変える必要があります。ここに記載されているソリューションのいずれかを使用してサイズを変更できますが、ユーザーが各画面を進むときにフレームのサイズは更新されません。

これまでに思いついた最も近い解決策は、document.onclickハンドラーを使用して、サブページの次の画面が表示される可能性のあるクリックをキャッチすることです。ハンドラーは非常に短い時間（次の画面が表示されるようにするため）一時停止してから、必要なサイズ変更関数を呼び出します。ただし、これは非常にハッキーな解決策のように感じます。また、新しいコンテンツに合わせてスクロールバーがまだ拡張されていない場合、フレームの側面にスクロールバーが表示されるまでにわずかな遅延があります。これを行うにはもっと良い方法があるに違いないと思います。

4

1 に答える 1

2

ファイルが同じサーバー/ドメインにある場合は、jQueryを使用してファイルを読み込むことができます。jQueryコードは次のとおりです。

<script type="text/javascript">
$(document).ready(function() {
$('#id-of-div').load('/path/to/page.html');
});
</script>

ページをロードするdivのに変更しid-of-div、ページの実際のURLに変更するだけです。（ドメインは必要ありません。パスだけが必要です）id/path/to/page.html

これがお役に立てば幸いです。

これがあなたの質問に答える場合、この答えを受け入れるためにこれの隣のチェックマークをクリックすることを忘れないでください。

于 2011-08-17T00:08:29.263 に答える