Как мне остановить браузер от перехода в сфокусированное поле?

Question

Как мне остановить браузер от перехода в сфокусированное поле?

0

У меня есть форма внутри контейнера с переполнением: скрыто, и я меняю его имя класса, где каждый класс делает свой верхний край, чтобы показать правильное сфокусированное поле с помощью focus().

Таким образом, jQuery применяет только className. Никакой анимации, кроме webkit, не участвует.

Проблема в том, что до появления анимации форма ДВИЖЕТСЯ внутри контейнера, чтобы открыть скрытое поле. В инспекторе ничего не меняется: верхний, верхний маржа, верхнее заполнение остаются неизменными.

Я попробовал preventDefaults(); на сфокусированных полях, никакого успеха.

Вот сценарий, показывающий случай.

http://jsfiddle.net/dNk9v/

UPDATE: я хочу пояснить, что когда "табуляция" в следующее поле, она идет туда, но анимация css происходит поверх нее, и форма либо не перескакивает без анимации, либо просто оживляет ALONG с уже пронумерованной прокруткой/показывая, что ожидаемое поле выходит за пределы контейнера.

Нажатие на вкладку тегов легенд работает так, как ожидалось. Я попытаюсь предотвратить дефолты для событий keydown, а не фокуса, и я буду держать вас в курсе.

sergio 14 дек. 2013, в 06:16

Источник

0

Кажется, он работает точно так, как задумано в моем браузере Chrome?
adeneo 14 дек. 2013, в 04:56
0

Как вам воспроизвести проблему в jsFiddle? Я также не вижу проблемы в Chrome. Макет не работает правильно в Firefox. Анимация вообще не работает в IE.
jfriend00 14 дек. 2013, в 04:58
0

Кажется, работает в Firefox тоже.
user1864610 14 дек. 2013, в 04:59
0

Возможно, я не очень ясно дал понять, что проблема возникает, когда вы фокусируете поле клавишей TAB. Вкладки тегов легенды работают хорошо при нажатии. Проблема заключается в неконтролируемой прокрутке формы для отображения поля при фокусировке с помощью клавиатуры (клавиша табуляции до сих пор. Я не знаю другого способа). Это не терпит неудачу, когда сосредоточено с инструментами разработчика. Это может быть ключом, который вызывает его, поэтому фокус - это результат, а не причина.
sergio 19 дек. 2013, в 05:54

Показать ещё 2 комментария

Теги:

jquery

focus

overflow

1 ответ

Ещё вопросы

Кажется, он работает точно так, как задумано в моем браузере Chrome?
Как вам воспроизвести проблему в jsFiddle? Я также не вижу проблемы в Chrome. Макет не работает правильно в Firefox. Анимация вообще не работает в IE.
Возможно, я не очень ясно дал понять, что проблема возникает, когда вы фокусируете поле клавишей TAB. Вкладки тегов легенды работают хорошо при нажатии. Проблема заключается в неконтролируемой прокрутке формы для отображения поля при фокусировке с помощью клавиатуры (клавиша табуляции до сих пор. Я не знаю другого способа). Это не терпит неудачу, когда сосредоточено с инструментами разработчика. Это может быть ключом, который вызывает его, поэтому фокус - это результат, а не причина.

stevero · Accepted Answer · 2015-04-07T15-39-00.000Z

За этот пост это выглядит довольно сложной проблемой: https://forum.jquery.com/topic/chrome-bug-or-how-do-i-prevent-a-form-field-to-scroll-the- контейнер-когда-ориентированных

Я справился с подобными проблемами, вручную управляя атрибутом tabindex входов. Это устраняет нежелательную псевдопрокрутку, но также удаляет возможность входа на вкладки вне окна просмотра. Если вы хотите жить с этим, вы можете легко добавить код для своих обработчиков кликов для добавления или удаления tabindexes:

$(inputEl).attr('tabindex', -1);  // removes tabbing
$(inputEl).attr('tabindex', 1);   // restores tabbing

Удалите индексы вкладок с входов вне окна просмотра и восстановите их для видимых входов.

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