Javascript: Как Правильно Курить Ie10, Или Проблемы С Миграцией

Авторское отступление: Не забрасывайте камнями тех, кто пишет для разных браузеров! В моей работе из-за использования компонентов ActiveX на данный момент поддерживается только IE. Поэтому следующее обсуждение касается только разных версий IE. IE10 — специальный браузер.

Многое из того, что было верно в предыдущих версиях IE, больше не работает. Учитываются только ошибки JavaScript, возникшие во время миграции устаревшего кода.

Разница CSS выходит за рамки этой статьи.

Итак, ниже приведен список типичных ошибок IE10, возникающих при переходе со старых версий IE.



1. Крест за расчистку поля

В IE10, когда вы вводите текстовое поле, появляется крестик для очистки поля (кроме небольших полей).

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

Они связаны с тем, что очистка поля при нажатии крестика является событием ввода.

В этом случае событие изменения (а также нажатие клавиши, нажатие клавиши и нажатие клавиши) не происходит. Точнее, это происходит только тогда, когда теряется фокус.

Со всеми вытекающими, потому что.

это не ожидаемое для пользователя поведение (с точки зрения обычной обработки событий).

Однако скрыть этот крестик с помощью CSS можно только в режиме документа IE10:

  
  
   

.

someinput::-ms-clear { display: none; width: 0; height: 0; }

Эта функция недоступна в режиме совместимости.

Остается только поймать mousedown/mouseup и проверить, изменилось ли значение поля после клика.

Довольно грустно (хотя это работает).



2. Нет XPath?

В IE10 свойство responseXml ActiveXObject('MSXML2.XMLHTTP') теперь возвращает Document, а не IXMLDocument, который не имеет методов selectSingleNode и selectNodes, работающих с XPath (см.

IE10).

источник ).

Вывод состоит в том, чтобы установить тип ответа:

if (window.XMLHttpRequest) { try { ajaxXHR.responseType = "msxml-document"; } catch (e) { // ignore } }

При этом нельзя забывать, что возвращается документ версии 3.0, тогда как в более старых версиях возвращался документ версии 2.0. Документы разных версий несовместимы друг с другом.



3. Вы не можете добавлять собственные свойства в модель DOM.

Вместо этого мы используем пользовательские атрибуты (getAttribute()/setAttribute()).

Более того, при добавлении в тег пользовательского атрибута он становится доступен через getAttribute().

Важно помнить, что пользовательские атрибуты должны быть строками, а не объектами.

В IE10 объекты, передаваемые в setAttribute(), преобразуются в строку.



4. event.returnValue не поддерживаются.

Вместо этого мы используем PreventDefault:

if (event.preventDefault) { event.preventDefault(); } else { event.returnValue = false; }




Если кто-то сталкивался с другими особенностями IE10 при миграции JavaScript-кода, буду рад добавить в статью, напишите в комментариях.

Теги: #ie10 #JavaScript #JavaScript

Вместе с данным постом часто просматривают: