не отправляйте устаревший код javascript в современные браузеры
В JavaScript код устарел. Что это означает на практике?
5 ответов
у вас есть три способа справиться с этим, так как это написано на ссылке, которую вы поделились.
вы должны рассмотреть их, это правильный путь, если вы хотите поддержку кросс-браузера.
Это может быть легче, если вы реализуете что-то вроде этого.
MDN уже предоставил решение:
содержит соответствующее значение ключевого атрибута к клавише нажата
на момент написания этой статьи key свойство поддерживается всеми основными браузерами: Firefox 52, Chrome 55, Safari 10.1, Opera 46. Кроме Internet Explorer 11, который имеет : нестандартные идентификаторы ключей и неправильное поведение с AltGraph. Подробнее
Если это важно и / или обратная совместимость, то вы можете использовать обнаружение функций, как в следующем коде :
может быть, вы хотите рассмотреть возможность прямой совместимости i.e используйте устаревшие свойства, пока они доступны, и только при удалении переключитесь на новые :
Читайте также: KeyboardEvent.code свойства docs и еще несколько подробности в этом ответ.
TLDR: я бы посоветовал вам должны использовать новый event.key и event.code свойства вместо устаревших. IE и Edge поддерживают эти свойства, но пока не поддерживают новые имена ключей. Для них есть небольшой полифилл, который заставляет их выводить стандартные имена ключей / кодов:
Я пришел к этому вопросу в поисках причины того же MDN предупреждение как OP. После поиска еще немного, проблема с keyCode становится более ясной:
проблема с использованием keyCode что не-английские клавиатуры могут произвести различные выходы и даже клавиатуры с различными планами могут произвести несогласованные результаты. Кроме того, был случай
на практике, keyCode и charCode непоследовательны на разных платформах и даже одна и та же реализация в разных операционных системах или с использованием разных локализаций.
он идет в некоторую глубину, описывая, что было не так с keyCode : https://www.w3.org/TR/uievents/#legacy-key-attributes
эти функции никогда официально не указывались, и текущие реализации браузера существенно различаются. Большой объем устаревшего контента, включая библиотеки сценариев, которые полагаются на обнаружение агента пользователя и соответствующие действия, означают, что любая попытка формализовать эти устаревшие атрибуты и события будет рисковать сломать столько контента, сколько это исправит или позволит. Кроме того, эти атрибуты не подходят для международного использования и не касаются проблем доступности.
Итак, после установления причины, по которой был заменен устаревший код ключа, давайте посмотрим, что вам нужно сделать сегодня:
делай то, что я делаю. Мне просто все равно. MDN может сказать, что он устарел, но если они не предоставляют альтернативу (за исключением keyIdentifier), то вы должны использовать устаревшую версию.
Вывод уведомления об устаревшем браузере с помощью jReject
Многие веб-сайты выводят предупреждения об устаревших браузерах или и вовсе отправляют пользователя устанавливать новый браузер или Google Chrome Frame.
jReject — специальный плагин для jQuery, позволяющий отображать подобные уведомления с помощью нескольких строчек кода.
Настройка блокируемых браузеров
Плагин позволяет гибко настроить список браузеров, пользователи которых увидят уведомление.
Например, чтобы выдавать сообщение пользователям неизвестных браузеров, а также Firefox 2 и Internet Explorer 5, достаточно сконфигурировать плагин следующим образом:
Internet Explorer пятой и шестой версий блокируются плагином автоматически, поэтому если вы почему-то хотите беспрепятственно пускать на сайт пользователей IE6 необходимо указать это отдельно (msie6: false ).
Плагин позволяет указывать не только определённые версии браузеров, но и целые их семейства, движки, а также операционные системы. Полный список применяемых обозначений:
| Группа | Ключевые слова |
|---|---|
| Opera | opera, opera7, opera8, opera9, opera10 |
| Google Chrome | chrome, chrome1, chrome2, chrome3, chrome4 |
| Firefox | firefox, firefox1, firefox2, firefox3 |
| Internet Explorer | msie, msie5, msie6, msie7, msie8 |
| Safari | safari, safari2, safari3, safari4 |
| Konqueror | konqueror, konqueror1, konqueror2, konqueror3 |
| Движки | gecko, webkit, trident, khtml, presto |
| ОС | win, mac, linux, solaris, iphone |
| Всё остальное | unknown |
Предлагаемые браузеры
Полезные опции
Плагин поддерживает ряд опций, смысл которых вполне понятен из их названий.
Особенности
Прямо в самом плагине «вшит» стандартный набор предлагаемых браузеров вместе с их версиями, которые давно уже устарели. Несмотря на то, что плагин был обновлён менее месяца назад, он всё ещё предлагает по умолчанию установить Chrome 18 или Opera 11. Для того, чтобы исправить это недоразумение достаточно либо указать актуальные версии в самом коде плагина, либо вообще убрать оттуда версии, оставив лишь названия браузеров. Второй вариант, разумеется, будет намного корректнее — едва ли кто-то станет постоянно обновлять данные вместе с выходом новых версий браузеров. Можно также вручную указывать список браузеров с их актуальными версиями при вызове плагина.
Ещё один немаловажный момент: для того, чтобы корректно отображались логотипы браузеров, необходимо указать в параметре imagePath адрес каталога, где они размещены. По умолчанию используется путь ./images/.
Уведомление о том, что браузер устарел
Они уходят. Ещё вчера мы были вынуждены прикручивать очередной костыль для IE6/IE7, а сейчас в этом уже нет необходимости. В СНГ у IE6 сегодня всего 0.5% трафика, у IE7 — 1.8%. Они действительно уходят. Думаю, большинство верстальщиков давно уже не добивается попиксельного соответствия макету, а кто-то даже не проверяет на работоспособность сайтов в столь старых браузерах. В таком случае не будет лишним предупредить пользователя, что сайт может работать неправильно, и предложить обновиться. Предлагаю готовый комплект из панельки предупреждения и страницы с предложением выбрать новый браузер.
Вы можете использовать его как есть, или же исправить под свои нужды. Надеюсь, вы в любом случае сэкономите немного времени.
Как использовать?
Вы можете просто вставить эту строчку сразу после открывающего тега или в секции :
Из-за условного комментария этот скрипт будет загружаться только в IE9 и младше. При желании можете понизить планку до IE8 или IE7, исправив 9 на 8 или 7 соответственно. По этому адресу скрипт будет доступен постоянно, поскольку в таком виде он используется в phpBBex. Но если вас не устраивает подобная зависимость, вы можете скачать архив с исходными файлами, на основе которых вы сможете сделать свою версию.
Как это выглядит?
Пользователи устаревших версий IE увидят стилизованное под IE6 уведомление:
При клике по нему пользователь увидит страницу выбора нового браузера:
Здесь у многих хабравчан должно возникнуть ощущение «я уже где-то это видел». Действительно, это переработанная страница выбора браузера, которую кто-то в 2009 году уже публиковал на Хабре (к сожалению, оригинальный пост не нашёл).
А что насчёт IE8?
На IE8 приходится 5.1% трафика — всё ещё достаточно много, чтобы игнорировать существование такого браузера. Но доля его стремительно падает. Уже не за горами тот самый момент…
А как же старые версии других браузеров?
Как правило, проблемы «значительной доли» устаревших версий не касаются альтернативных браузеров — старые Firefox, Chrome и Opera практически полностью самоустраняются в течение двух-трёх лет после выхода новых версий. Firefox 3.6 был кандидатом на «долгожителя», поскольку многие любители Firefox холодно отнеслись к новому интерфейсу и плотному графику релизов любимого браузера, сознательно оставаясь на старой версии. Прошло немногим больше года после выхода Firefox 4, и сейчас у Firefox 3.6 всего 2.3%. Его доля падает быстрее, чем доли устаревших версий IE.
Плагин JS для отсеивания по версии браузера
К примеру, есть задача отсеять браузеры, с которых заходит пользователь, чтобы дать предупреждение о том, что всё поедет, в случае если пользователь зашёл с древнего браузера. К примеру, имеем такой список отсеивания: http://caniuse.com/#feat=flexbox.
Существует ли поддерживаемый плагин для голого JS или jQuery, чтобы влепить попап вроде такого?
На скриншоте плагин http://jreject.turnwheel.com, но он, к сожалению, последний раз обновлялся в 2014 году — нету поддержки мобильных браузеров.
3 ответа 3
К примеру решение по вопросу (попап при отсутсвии поддержки flexbox):
1. Bowser
Если мне необходимо
2. Характеристики bowser
3. Демонстрация
Как выглядит результат выполнения данного кода в браузерах:
Internet Explorer 11.576.14393.0
4. Дополнительная ссылка
Вместо отсеивания браузеров, лучше определять поддержку той или иной фичи, например с помощью modernizr.
Как помочь посетителю сайта обновить свой браузер?
Некоторые посетители вашего сайта могут пользоваться устаревшим или совсем не подходящим для вашего сайта браузером. Чтобы помочь такому посетителю обновить или установить нужный браузер, вы можете настроить уведомления на сайте с помощью скрипта Яндекса.
Пользователи устаревших браузеров видят предложение обновиться при каждой загрузке страницы. Уведомление выводится в виде плашки вверху страницы. По клике на плашку открывается попап со ссылками на последние версии популярных браузеров.
Вы можете выбрать минимальные версии браузеров самостоятельно, либо положиться на список по умолчанию, который поддерживает Яндекс (подробнее — в инструкциях ниже). Если вы пользуетесь собственным списком, не забывайте обновлять его по мере выхода новых версий браузеров.
Посетитель, который закрыл уведомление и не обновился, по умолчанию не увидит плашку снова в течение 30 дней. Вы можете изменить эту логику, вручную указав нужные значения параметров remember и rememberFor.
Браузер не поддерживается сайтом
Если браузер посетителя не поддерживается сайтом, он увидит только уведомление со ссылкой на последнюю версию поддерживаемого браузера. Уведомление полностью блокирует содержимое страниц, так что пользоваться сайтом в неподходящем браузере становится невозможно.
Код уведомления можно получить двумя способами:
Настроить уведомление с помощью конструктора
В конструкторе вы можете выбрать:
Тип уведомления и язык сообщений (параметры exclusive и lang).