У нас есть фрагмент кода, который устанавливает видимость элемента контейнера на hidden
, что-то делает с его потомками, а затем устанавливает видимость обратно на visible
.Это хорошо работает в современных браузерах, но в IE элементы ввода внутри контейнера теряют фокус после выполнения.
Чтобы продемонстрировать эту ситуацию, скажем, что мы имеем:
<div id="container">
<input id="input"/>
</div>
, если вы делаете:
var containerEl = document.getElementById('container');
var inputEl = document.getElementById('input');
inputEl.focus();
containerEl.style.visibility = 'hidden';
containerEl.style.visibility = 'visible';
Элемент ввода находится в фокусе в Chrome.Он теряет фокус в IE.
См. Эта демонстрация
Я использую последний Chrome66 и IE11 при тестировании.
Итак, почему
containerEl.style.visibility = 'hidden';
containerEl.style.visibility = 'visible';
заставляет фокусированный ввод терять фокус в IE?