将焦点设置在模式框中的输入字段上

Set focus on input field in modal box

本文关键字：输入 字段 焦点 设置 模式      更新时间：2023-09-26

我试图将焦点设置为模式框中的输入字段，但无法使其工作。

这是我尝试过的代码：

// 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();      
});

有什么建议我可以再试一次吗？

您使用的是正确的方法setFocus（）。

它工作得很好看到这个JSFiddle

这意味着您可能缺少正确的选择器。对于第一个标签first-focus是一个id，因此它可以直接称为$('#first-focus').setFocus();

您为codepen提供的链接正在执行setFocus()方法，该方法不是由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);
  });
});

这是一个工作代码笔链接

最好在leanModal的完全回调时调用focus()，但我在文档或源代码中找不到这样的回调。

尝试通过id:直接访问元素

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

希望这能有所帮助。

尝试进行

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