Javascript всегда думает, что мое содержимое и размер IFrame пустые, но это не так - Попытка изменить размер IFrame для автоматического добавления содержимого - PullRequest
0 голосов
/ 17 мая 2018

Так что я боролся с этим уже несколько часов, и все соответствующие результаты, которые я нашел, показали, что мой код верен, но, очевидно, это не так, поскольку он не работает.

В конечном счете, то, что яя пытаюсь сделать, это jsut изменить размер IFrame, чтобы соответствовать его содержимому (с минимумом 100px).Примечание. Iframe35382-content будет сгенерирован через бэкэнд, поэтому этот подход к заполнению IFrame.

Код правильно заполняет IFrame нужными мне данными и изменяет их размер, но по какой-то причине я явно пропускаювысота содержимого всегда возвращается как 150px (я так понимаю, это высота IFrame по умолчанию), а html, возвращаемый content (). find ('html') - используется для выгрузки содержимого IFrame - для которого я выплюнулцели отладки всегда не определены.

Любая помощь или направление приветствуются, возможно, просто нужен второй набор глаз, чтобы обнаружить что-то глупое ¯_ (ツ) _ / ¯

Соответствующий код ниже:

<iframe id="Iframe35382" width="100%" frameborder="0"></iframe>
<script id="Iframe35382-content" type="text/plain">
<html>
<head>
<p>Lengthy html(correctly displaying) shortened for porposes of question</p>
</body>
</html>
</script>
<script type="text/javascript">
function CheckIFrameHeight($frame)
{
  var newHeight = $frame.contents().height();
  alert(newHeight); // DEBUG
  alert($frame.contents().find('html').html()); // DEBUG
  if(!newHeight || isNaN(newHeight))
    newHeight = 100;
  $frame.height(newHeight + 'px');
}
var iframe = document.getElementById('Iframe35382');
iframe.src = 'data:text/html,' + encodeURIComponent($('#Iframe35382-content').text());
CheckIFrameHeight($('#Iframe35382'));
</script>

1 Ответ

0 голосов
/ 18 мая 2018

После долгих проб и ошибок я обнаружил, что проблема заключалась в том, как код вводится во фрейм с помощью:

data:text/html, [...]

Несмотря на то, что это рекомендуемый способ сделать это, я нашел в Stackoverflow, похоже, он нарушает проверки происхождения IFrame, используя другой метод для заполнения IFrame, что решило все проблемы, а именно, запись непосредственно в документ IFrame.

// Remove this line
iframe.src = 'data:text/html,' + encodeURIComponent($('#Iframe35382-content').text());

// Replace with these
var iframedoc = iframe.contentDocument;
if(iframedoc)
{
  iframedoc.open();
  iframedoc.writeln($('#Iframe35382-content').text());
  iframedoc.close();
 }

Это означает, что src atrtibute больше не используется - вообще, и оба содержимого () и высота () возвращаются правильно, что позволяет мне изменять размер IFrame до его содержимого.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...