Не могу понять, почему Chrome / Safari не может получить ScrollHeight прямо здесь - PullRequest
3 голосов
/ 03 октября 2010

Я только что задал вопрос о том, почему определенный код js не будет работать в Chrome и Safari на 100%, но после дополнительных устранения неполадок, я думаю, я понял, что это вопрос, который я должен опубликовать.

У меня есть страница с формой.Целью этой формы является iframe на той же странице.Iframe динамический и основан на php.

Это нижняя часть моего содержимого php iframe:

<body onload="parent.resize_iframe(document.body.scrollHeight)">
<?php echo $display_table; ?>

Как видите, я вызываю функцию для изменения высоты iframe в основнойpage (родительская страница).

Это работает нормально, и на самом деле оно изменяется, НО в Chrome и Safari изменение размера устанавливает высоту «выше», чем должно быть.Таким образом, если высота равна 500px, то Chrome и Safari устанавливают ее около 2000px, что является максимальной высотой документа iframe.

Почему это так?Одна мысль может заключаться в том, что тело не загружается полностью до отправки scrollHeight в функцию изменения размера, может быть?

Есть ли способ заставить его ждать, пока документ не будет полностью загружен?

Одна вещь, которая меня смущает, это то, что когда я нажимаю на ссылку на главной странице, а затем нажимаю назад, изменение размера страницы работает хорошо, и устанавливается на 500 пикселей, как и должно быть даже в Chrome / Safari.Но вот когда я нажал «назад» в браузере.

Хммм, я действительно не понимаю этого, поэтому, пожалуйста, помогите мне здесь.

Спасибо

1 Ответ

1 голос
/ 22 октября 2010

document.body.scrollHeight всегда будет возвращать одно из двух значений в chrome:

если содержимое документа длиннее, чем высота окна, тогда возвращается высота содержимого

если документ короче высоты окна, то высота окна возвращается.

Звучит так, как будто у вас в IFrame установлена ​​высота. Когда содержимое в iframe загружается, оно будет обрабатывать iframe как окно. Таким образом, если высота iframe установлена ​​на 2000, а высота вашего контента - только на 500, Chrome вернет смещение в 2000.

Если это так, самое простое, что нужно сделать, это установить высоту фрейма в 1px. (или авто)

Еще один вариант (как указано): вы можете создать div-обертку сразу после тела, содержащего весь ваш контент. Затем вы можете просто получить высоту этого div и вернуть его родительской функции

По этому вопросу:

Есть ли способ заставить его ждать пока документ полностью не загружен?

Ответ - да, и вы уже делаете это. Поскольку вы вызываете parent.resize_iframe при загрузке, функция не будет вызываться до тех пор, пока все HTML, JS, CSS и изображения не будут загружены на экран. Однако следует отметить, что есть некоторые недостатки использования функции onload тегов body. Во-первых, он должен загрузить все изображения перед вызовом onload. Во-вторых, если кто-то подключится к window.onload, ваша функция никогда не будет вызвана. Если вы заинтересованы в получении дополнительной информации о нагрузке и способах ее решения, перейдите по этой ссылке http://www.webreference.com/programming/javascript/onloads/

...