Мероприятие по готовности молдавских леев

MDL обновляет свои компоненты при загрузке страницы, поэтому <input> с атрибутом autofocus теряет фокус. Я хочу установить фокус на этом входе после того, как MDL завершит повторную визуализацию.

Я пытаюсь прослушать событие ready страницы (codepen) :

$('input#srch').one('componentDidUpdate', function(){console.log('ready')});

Не работает ни с селекторами $(document), ни с $(document.body), ни с $('.mdl-layout').
Я искал похожие события, но безуспешно, я что-то упустил?
Конечно, я могу использовать setTimeout, но я не думаю, что это должно быть решением. ????

Спасибо.


material-design jquery autofocus material-design-lite javascript-events
person mu3    schedule 18.02.2016    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Вы можете прослушивать событие mdl-componentupgraded в элементе макета .mdl-ayout.

$(document).ready(function() {
    $('.mdl-layout').on('mdl-componentupgraded', function(e) {
        if ($(e.target).hasClass('mdl-layout')) {
            alert('ready');
        }
    });
});

Используйте on вместо one. На вашей странице может быть обновлено несколько элементов. Используя one, вы поймаете только первое обновление. С on обработчик будет вызываться несколько раз из-за всплытия событий. Отметьте e.target, чтобы отреагировать на конкретное обновление элемента макета.

Используйте обратный вызов $(document).ready(). Подождите, пока DOM будет готов, прежде чем прикреплять обработчики к его элементам. В противном случае селектор $('.mdl-layout') может не совпасть, и обработчик событий может не подключиться.

person Rafa    schedule 03.07.2016
comment
Используя firefox, вызов mdl-componentupgraded выполняется только после того, как я загружаю страницу, а затем обновляю ее ... У вас есть идеи, почему это может быть? Отлично работает с Chrome - person fogx; 09.08.2018

arrow_upward
0
arrow_downward

Я уверен, что вы могли бы прослушать событие mdl-componentupgraded:

$('input#srch').bind('mdl-componentupgraded', function(){console.log('ready')});
person link0ff    schedule 21.03.2016