Установить фокус на поле ввода в модальном поле

Question

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

Вот код, который я пробовал:

// MODAL BOX 
$(function() { 
    $('a[rel*=leanModal]').leanModal({ top : 100, closeButton: ".modal_close" }).find("#first-focus").focus();  
}); 

И

// MODAL BOX 
$(function() { 
    $('a[rel*=leanModal]').leanModal({ top : 100, closeButton: ".modal_close" }).find("input:text:visible:first").focus();  
}); 

Любые предложения о том, что я могу попробовать еще?

Answer 1

Вы используете правильный метод setFocus().

Он работает отлично видеть this JSFiddle

Это означает, что вы, вероятно, отсутствует правильный селектор. Для первого тега first-focus это идентификатор, так что непосредственно можно назвать $('#first-focus').setFocus();

по ссылке, которую вы предоставили для codepensetFocus() выполняет метод, который не определен JQuery. Метод jQuery - focus(). Кроме того, этот метод называется только один раз. Он должен быть вызван по щелчку ссылки Open.

Ваш код теперь стал бы

// MODAL BOX 
$(function() { 
    $('a[rel*=leanModal]').leanModal({ 
    top: 100, 
    closeButton: ".modal_close" 
    }).click(function() { 
    $('#first-focus').focus(); 
    console.log($("#first-focus").length); 
    }); 
}); 

Вот рабочий codepen link

Было бы лучше назвать focus() OnComplete дозвона leanModal однако я не смог найти такую ​​функцию обратного вызова в документации или в источник.

Answer 2

Попробуйте получить доступ непосредственно к элементу по id:

$("#first-focus").focus(); 

Надеется, что это помогает.

Answer 3

Попробуйте сделать

$("a[rel*=leanModal]").on('click', function(){ 
    $(this).leanModal(); 
    $("#first-focus").focus(); 
})