$.focus() не работает
последний пример документации jQuery focus()
сообщает
$('#id').focus()
должен сделать ввод сфокусированным (активным). Кажется, я не могу работать.
Даже в консоли на этом сайте я пытаюсь найти окно поиска
$('input[name="q"]').focus()
и я ничего не получаю. Любые идеи?
Ответы
Ответ 1
На самом деле пример, который вы дали для фокусировки на этом сайте, работает отлично, если вы не сосредоточены на консоли. Причина, по которой это не работает, - это просто потому, что она не ворует фокус с консоли разработчика. Если вы запустите следующий код в консоли и затем быстро нажмите в окне своего браузера, вы увидите, что он фокусирует поле поиска:
setTimeout(function() { $('input[name="q"]').focus() }, 3000);
Что касается вашего другого, то, что в прошлом меня беспокоило, - это порядок событий. Вы не можете вызвать focus() для элемента, который не был прикреплен к DOM. Элемент, который вы пытаетесь сфокусировать, уже привязан к DOM?
Ответ 2
Найден решение в другом месте в сети...
$('#id').focus();
не работает.
$('#id').get(0).focus();
действительно работал.
Ответ 3
Некоторые из ответов здесь предлагают использовать setTimeout
для задержки процесса фокусировки на целевом элементе. Один из них упоминает, что цель находится внутри модального диалога. Я не могу больше прокомментировать правильность решения setTimeout
, не зная конкретных деталей того, где он был использован. Тем не менее, я думал, что должен предоставить ответ здесь, чтобы помочь людям, которые сталкиваются с этой нитью, как и я.
Простой факт состоит в том, что вы не можете сосредоточиться на элементе, который еще не виден. Если вы столкнулись с этой проблемой , убедитесь, что цель действительно видна, когда делается попытка ее сфокусировать. В моем случае я делал что-то в этом направлении
$('#elementid').animate({left:0,duration:'slow'});
$('#elementid').focus();
Это не сработало. Я только понял, что происходит, когда я выполнил $('# elementid'). Focus() `из консоли, в которой сделал. Разница - в моем коде выше цели нет уверенности в том, что цель будет отображаться, потому что анимация может быть неполной. И есть ключ
$('#elementid').animate({left:0,duration:'slow',complete:focusFunction});
function focusFunction(){$('#elementid').focus();}
работает так, как ожидалось. Я тоже изначально поставил решение setTimeout
, и он тоже работал. Тем не менее, произвольно выбранный тайм-аут обязан рано или поздно разорвать решение в зависимости от того, как медленно хост-устройство переходит к процессу обеспечения видимости целевого элемента.
Ответ 4
Я понимаю, что это старый, но наткнулся на него сегодня. Ни один из ответов не работал у меня, что я нашел, что работал был setTimeout. Я хотел, чтобы мой фокус был помещен на входной файл модального файла, используя обработанный setTimeout. Надеюсь, это поможет!
Ответ 5
если вы используете bootstrap + modal, это сработало для меня:
$(myModal).modal('toggle');
$(myModal).on('shown.bs.modal', function() {
$('#modalSearchBox').focus()
});
Ответ 6
У меня также была эта проблема. Решение, которое работало в моем случае, было использование свойства tabindex в элементе HTML.
Я использовал ng-repeat
для некоторых элементов li внутри списка, и я не смог перенести фокус на первый li, используя .focus(), поэтому я просто добавил атрибут tabindex для каждого li во время цикла.
так что теперь <li ng-repeat="user in users track by $index" tabindex="{{$index+1}}"></li>
То, что +1 было индексом, начинается с 0.
Также убедитесь, что элемент присутствует в DOM перед вызовом функции .focus()
Надеюсь, это поможет.
Ответ 7
ДОПОЛНИТЕЛЬНОЕ РЕШЕНИЕ Если бы проблема с фокусом() не работала, но в конечном итоге оказалось, что нужно было прокручиваться до правильной позиции:
Ответ 8
На всякий случай кто-то другой сталкивается с этим вопросом и имеет ту же ситуацию, что и я, - я пытался настроить фокус после нажатия на другой элемент, но фокус не работал. Оказывается, мне просто нужен e.preventDefault();
- вот пример:
$('#recipients ul li').mousedown(function(e) {
// add recipient to list
...
// focus back onto the input
$('#message_recipient_input').focus();
// prevent the focus from leaving
e.preventDefault();
});
Это помогло:
Если вы вызываете HTMLElement.focus() из обработчика события mousedown, вы должны вызвать event.preventDefault(), чтобы фокус не покидал HTMLElement. Источник: https://developer.mozilla.org/en/docs/Web/API/HTMLElement/focus