AddEventListener 'resize' не срабатывает при изменении размера окна браузера

Мне нужно обнаружить изменения ширины окна просмотра для мобильных устройств. Я использую следующий код для обнаружения изменений размера окна браузера, но addEventListener не запускает мои функции при изменении размера окна:

<html>
<head>
</head>
<body>

<div id = "size">-</div><br>
<div id = "orientation">-</div>

<script>

window.addEventListener('resize', sizeChanged() );

function sizeChanged() {

    var w=window.outerWidth;
    var h=window.outerHeight;
    var txt='<b>sizeChanged:</b><br> W=' + w + 'px<br> H=' + h+'px';
    document.getElementById('size').innerHTML=txt;
    console.info(txt);
}

window.addEventListener('orientationchange', orientationChanged() );

function orientationChanged() {

  var w=window.outerWidth;
  var h=window.outerHeight;
  var txt='<b>orientationChanged:</b><br> W=' + w + 'px<br> H=' + h+'px';
  document.getElementById('orientation').innerHTML=txt;
  console.info(txt);

}

</script>

</body>
</html>

Я использовал приведенный выше код с FF 62.0.3, Chrome 70.0.3538.77 и IE11.

Кто-нибудь знает, что не так с моим кодом?

javascript addeventlistener window-resize device-orientation

27.10.2018 04:36

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

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

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

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

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

4 465

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вы внезапно вызываете эти функции, поэтому в основном вы передаете результат этих функций, в данном случае undefined.

Вам нужно передать функцию как ссылку (параметр), например,

window.addEventListener('resize', sizeChanged); // Look at the missing parentheses.
window.addEventListener('orientationchange', orientationChanged); // Look at the missing parentheses.

27.10.2018 04:38

Другие вопросы по теме

Код выполнения Firebase, ЕСЛИ дочерний объект был создан

Eventlistener запускается без нажатия

Скрыть элемент при нажатии на него с помощью addEventListener

ClientX и ClientY не обновляются достаточно быстро, когда они запускаются через событие mousemove. Почему?

Добавление события клика к ключевому событию

Как добавить прослушиватель событий сразу в несколько тегов

Сброс анимации в javascript

JavaScript: проверьте, произошло ли событие после нажатия кнопки

У меня проблема с настройкой прослушивателя событий на кнопку JS

Как добавить прослушиватель событий к элементу, который находится внутри функции в компоненте React?

AddEventListener 'resize' не срабатывает при изменении размера окна браузера

Ответы 1

Другие вопросы по теме

Похожие вопросы