web-dev-qa-db-ja.com

jQueryはコンテンツ付きのiFrameを追加します

私はそのような問題を抱えています。 fancyboxでiframeを開く必要があります（開いたドキュメントのリンクを参照してfancyboxに留まる必要があるため、iframeが必要です）src属性ではなく、変数からコンテンツをiframeに入れたいです（既にコンテンツを取得しています） by AJAX（iframeに配置する前にコンテンツを確認する必要があるため、AJAXクエリの代わりに行う方法はありません）。もう1つのクエリは必要ありません）。

Fancyboxでは、 'type'： 'iframe'で 'content'属性を使用できません。そこで、iframeを動的に作成し、コンテンツを挿入し、fancyboxで通常のブロックとしてiframeを表示することにしました。

みたいな

jQuery('<iframe id="someId"/>').appendTo('body').contents().find('body').append(content);

そしてより

jQuery('<iframe id="someId"/>').fancybox();

しかし、最初の部分は機能しません。ページに追加されたiframeが表示されますが、コンテンツがありません（可変コンテンツに完全なHTMLページがありますが、テキストのみを追加しようとしても機能しません）。

私が間違ったことは何ですか？

多分私が必要なことを行う別の方法がありますか？

jqueryiframefancybox
15
krasilich

あなたの問題はjqueryのreadyメソッドをこのように呼び出した後に解決されます

<script type="text/javascript">
$(function(){
$('<iframe id="someId"/>').appendTo('body');
$('#someId').contents().find('body').append('<b>hello sajjad</b>');
});
</script>

<iframe id="someId"></iframe>
18
sajjad hussain

その行を2つに分割するとどうなりますか。

jQuery('<iframe id="someId"/>').appendTo('body');
jQuery('#someId').contents().find('body').append(content);

次に、新しいiframeを作成する前に、セレクターをDOMと呼び出し側のファンシーボックスに挿入するのではなく、正しいものに変更しますが、これは機能するはずです。

jQuery('#someId').fancybox();
4
Marcus Whybrow

この質問の時間が経過しましたが、ここに別の解決策があります：

var ifrm = document.createElement("iframe");
document.body.appendChild(ifrm);
ifrm.id = "someId"; // optional id
ifrm.onload = function() {
    // optional onload behaviour
}
setTimeout(function() {
    $(ifrm).contents().find("body").html(content);
}, 1);
2
Igor Parra