JQuery добавить iFrame с контентом
У меня такая проблема.
Мне нужно открыть iframe в fancybox (мне нужен iframe, потому что мне нужно просматривать ссылки в открытом документе и оставаться в fancybox),
но я хочу поместить содержимое в iframe из переменной, а не через атрибут src (у меня уже есть содержимое от AJAX (мне нужно сделать некоторые проверки содержимого, прежде чем помещать его в iframe, поэтому нет способа сделать это вместо AJAX) запрос), поэтому мне не нужен еще один запрос).
Fancybox не позволяет использовать атрибут content с типом type: iframe. Поэтому я решил создать iframe динамически, вставить в него свой контент и показывать iframe by fancybox как обычный блок.
Это как
jQuery('<iframe id="someId"/>').appendTo('body').contents().find('body').append(content);
И чем
jQuery('<iframe id="someId"/>').fancybox();
Но первая часть не работает. Я вижу iframe, который был добавлен на страницу, но без какого-либо контента (у меня полная HTML-страница в переменном контенте, но когда я пытаюсь добавить только какой-то текст, он тоже не работает).
Что я сделал не так?
Может есть другой способ сделать то, что мне нужно?
Ответы
Ответ 1
ваша проблема будет решена после вызова метода 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>
Ответ 2
Что произойдет, если вы разделите эту строку на две части:
jQuery('<iframe id="someId"/>').appendTo('body');
jQuery('#someId').contents().find('body').append(content);
Затем измените свой селектор на правильность, прежде чем он создаст новый iframe, не вставляя его в DOM и вызывающий fancybox на него, однако это должно работать:
jQuery('#someId').fancybox();
Ответ 3
Прошло время этого вопроса, но вот еще одно решение:
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);