2009-04-20 4 views
14

と仮定私はいくつかのタブ(例えば、jqueryのタブ)を持っていると私は二つの方法のiframe

  1. 使用jqueryのAjaxのタブに(基本的にdiv要素を満たすことを行うことができ、動的に各タブには、いくつかのページをロードしますajax data) または
  2. 各タブにはiframeとページが含まれています。

。ユーザーへの2つのアプローチの違いは何もないと思いますか?

Q2。私はiframeの方がiframeは任意のページを読み込むことができますが、時々divにajaxデータを読み込むことが期待どおりに動作しない可能性があると思う。

+1

良い質問.. –

答えて

6

1つは、インクルードされたページ(またはajax呼び出し)にエラーがあると、おそらくajaxの手法で処理する方が良いでしょう。 iframeを使用すると、ページの中央に醜い404または500エラーが表示されます。しかし、ajaxでは、エラーを検出してより使いやすいエラーメッセージを表示することができます。

また、ページに読み込むデータによって異なります。あなたがロードされているHTMLを制御するならば、起こりうるディスプレイ上の問題を避けるか修正することができます。コントロールの外にページをロードする必要がある場合は、iframeが最適(または必要)になります。

もアプローチのいずれかに関与アクセシビリティの問題も、私は

1

ページは、満足している場合など、スクリーンリーダーで最適に動作しているアプローチを決定するのに十分なものに慣れていないよ、とあなたができることスタイルシートや各自がアクセスしているすべてのものをコントロールしてください。その後、オプション番号1を使用してください。エンジニアリングすることで、共有コンテンツを複数回取得する必要がなくなります。

ページがコントロールから外れている場合(外部サイトなど)、iFramesに読み込みます。

0

コンテンツが外部サイトから読み込まれていて、幅と高さがあらかじめわかっていない場合は、スクロールバーの問題に遭遇する可能性があります。 ajaxとDOM操作では、この問題は発生しません。

これが私が特定のケースでiFramesをダンプした理由の1つです。 iframeにロードされているリモートサイトからの幅と高さを報告する非常に面白い解決策は、単純に問題にはならなかった。

+0

もしsmoeoneがiframeの高さと幅を知っているなら、どうすればいいですか –

0

読み込み中のページ(ページiframeが読み込もうとしている)がすぐに応答して空白ブロックが生成されない場合、iframeはレンダリングのために他のajaxリクエストを停止させる可能性があります。

一方、iframeの方が強力な場合は、特に透明な背景を持つフレームをスタックし、その幅や高さを気にする必要はなく、枠なしの同じページのように見えます。

0

ソースコンテンツはどこにあるのかをご確認ください。ドメイン内にある場合は、iframeまたはajax呼び出しのいずれかを使用できます。しかし、それが別のドメインにある場合、 "クロスサイトスクリプティング"保護のためにajaxを使用することはできません。

iframeとajax呼び出しの間の選択についての主要な側面だと思います。

+0

JavaでAccess Control-Allow-Originを使うことでこれを回避する方法があります: 'response.addHeader(" Access-Control-Allow-Origin " 、 "*"); '。 – Ithar

+1

@Ithar:そうです。しかし、あなたはあなたのタブにコンテンツを提供するサーバー側のコードを制御できると仮定しています。 –