2011-11-13 6 views
3

を示していないのiFrameは、私はjQueryのモバイルページへのiframeを追加した

<a href="#testit" data-icon="search" rel="external">Got to iFrame Page</a> 

<!--test iframe page--> 

<div data-role="page" id="testit"> 

    <div data-role="header"> 
     <h1>Page Title</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <iframe src="http://www.google.com" width="100%" height="100%"> 
      <p>Your browser does not support iframes.</p> 
     </iframe> 
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 

<!--end test iframe--> 

問題は、私はページのちょうどヘッダーとフッターを取得するということです... iFrameコンテンツが表示されません。

+0

iframeのヘッダーとフッターは表示されますが、コンテンツは表示されません。 – ghostCoder

答えて

3

http://www.google.com/を使用しないでください。別のURLを使用してみてください。本当に参考にしたいところがわかりません。

私が変更した場合src、それは完全に正常に動作http://www.msn.com

それはX-フレーム・オプションとは何かを持っています。 Google Chromeでは、次のメッセージが表示されます。X-Frame-Optionsによって表示が禁止されているため、ドキュメントの表示を拒否されました。

HTTPヘッダX-Frame-Optionsを設定することでこれを操作できます。参照: Overcoming "Display forbidden by X-Frame-Options"

Googleが拒否またはSAMEORIGINを送信し、それが
編集機能しない理由thatsのほとんどの

:私は実際に正確だ

HTTP/1.1 200 OK 
Date: Mon, 14 Nov 2011 20:25:29 GMT 
Expires: -1 
Cache-Control: private, max-age=0 
Content-Type: text/html; charset=UTF-8 
Content-Encoding: gzip 
Server: gws 
Content-Length: 18112 
X-XSS-Protection: 1; mode=block 
X-Frame-Options: SAMEORIGIN 
2

:フィドラーで確認し、Googleは以下のヘッダを持っているが同じ問題ですが、コンテンツが自分のサーバーからロードされているので、私はヘッダーの設定について確信しています。 高さや幅が正しく設定されていないという問題点は、iFrameの表示後に特定の値に設定すると、再描画が発生し、iFrameデータが表示されることを意味します。

$('.html-content').css('height', '768px')

に会ったためだから、解決策は、これは多分それが誰かを助け古いですがしました。

関連する問題