DHTML: получить обновленный размер элемента - PullRequest
Новая
       10

DHTML: получить обновленный размер элемента

3 голосов
/ 30 декабря 2008

Я обновляю атрибут src тега <img> в javascript. После того, как я это сделал, мне нужно получить новую высоту его родителя <div>, чтобы я мог обновить размер других элементов на странице. Если я получу свойство offsetHeight родительского объекта сразу после обновления src изображения, я получу высоту до изменения, которое было сделано. Есть ли способ заставить браузер отображать обновленную страницу, чтобы я мог получить новую высоту?

Репро: 

<html>
<head>
<script type="text/javascript">
    function changeImage(){
        document.getElementById("image").src = "b.jpg";
        // here I need to re-render the page
        alert(document.getElementById("parent").offsetHeight);
        // ^ alerts the height of a.jpg, not b.jpg (unless this is the second click)
    }
</script>
</head>

<body onclick="changeImage()">

<div id="parent">
    <img id="image" src="a.jpg" />
</div>

</body>
</html>

Ответы [ 2 ]

3 голосов
/ 30 декабря 2008

Если вам не нужна новая высота сразу, используйте решение Марка. Однако, если вам нужна высота, когда пользователь нажимает кнопку, вам нужно предварительно загрузить b.jpg. Тогда я не знаю, будет ли высота правильной прямо в той же функции, но я предполагаю setTimeout ('alert (document.getElementById ("parent"). OffsetHeight);', 1); предупредит высоту в течение миллисекунды.

2 голосов
/ 30 декабря 2008

Может потребоваться дождаться окончания загрузки изображения, прежде чем станет доступна высота. В вашем примере кода установка атрибута «src» будет загружать изображение (b.jpg) асинхронно, поэтому вы можете захотеть прикрепить обработчик «onload» к этому элементу, чтобы получать уведомления об окончании загрузки и рендеринга.

...