В настоящее время в h5 появилось много новых функций, новых тегов, новых спецификаций и т. д., и они постоянно совершенствуются. Поддержка основных производителей браузеров также довольно сильна. Я считаю, что нам, как фронтенд-программистам, по-прежнему нужно активно уделять этому внимание и смело практиковать это. Далее я поделюсь с вами очень полезной новой функцией h5 (на данный момент она не особенно нова), которая позволяет легко отслеживать ключ возврата любого приложения, включая физический ключ возврата телефонов Android, чтобы соответствовать дальнейшим потребности в разработке проекта.
2. ПричинаОколо полугода назад я получил от PM запрос на использование чистого h5 для реализации воспроизведения, паузы и возобновления мультиаудио. Страница размещена в приложении Driving Test Guide, и взаимодействия с клиентом нет. поэтому не нужно ссылаться на js, связанный с клиентом. Кажется, это требование довольно простое, хотя я никогда раньше не предъявлял подобного требования. Несмотря ни на что, просто засучите рукава и сделайте это. Учебный путь начался.
3. Здесь я сосредоточусь на том, как я отслеживаю ключ возврата, который поставляется с любым приложением, а также физический ключ возврата на компьютерах Android.Так почему я должен следить за этим, мне нужно подчеркивать это снова и снова? Будь то WeChat, QQ, приложение или браузер на телефоне Apple, когда дело доходит до аудио и видео, система автоматически приостанавливает текущее воспроизведение при возврате на предыдущую страницу, но не все телефоны Android могут это делать. Поэтому мы должны сами настроить мониторинг. Многие друзья могут сначала подумать о Baidu, а потом ответ будет не чем иным, как этим.
pushHistory(); window.addEventListener(popstate, function(e) { alert(я прослушивал событие кнопки «Назад» в браузере); //Реализуйте свои собственные функции в соответствии с вашими потребностями}, false); function pushHistory() { var state = { title: title, url: # }; window.history.pushState (состояние, заголовок, # });Это выглядит знакомо? Однако ключевые требования не удалось реализовать в полной мере. Я тогда ломал голову, для чего нужен этот код. Я скопировал этот код только под руководством своего хорошего друга.
varhiddenProperty = «скрытый» в документе? «скрытый»: «webkitHidden» в документе? «webkitHidden»: «mozHidden» в документе? );var onVisibilityChange = function(){ if (!document[hiddenProperty]) { console.log('Страница неактивна'); }else{ console.log('Страница активирована') }}document.addEventListener(visibilityChangeEvent, onVisibilityChange);Все проблемы решены.
Мое личное понимание принципа этого кода заключается в выполнении связанных операций путем определения того, просматривает ли пользователь текущую страницу.
Это ссылка, связанная с MDN: https://developer.mozilla.org/zh-CN/docs/Web/API/Document/hidden.
Дело не в том, что вы действительно можете контролировать встроенную кнопку «Назад» в приложении или даже физическую кнопку «Назад» в Android через JS, но вы можете быстро реализовать свои потребности, изменив свое мышление. Надеюсь, эта функция может вам помочь.
Выше приведено все содержание этой статьи. Я надеюсь, что она будет полезна для изучения всеми. Я также надеюсь, что все поддержат сеть VeVb Wulin.