Jquery $.focus()不工作

Jquery $.focus()不工作,jquery,Jquery,美国 应使输入集中(激活)。我好像没法让它工作 即使在这个网站的控制台上,我也在尝试搜索框 $('input[name="q"]').focus() 我什么也得不到。有什么想法吗?事实上,只要你不在控制台中集中注意力,你给出的专注于此网站的示例就可以了。这不起作用的原因很简单,因为它没有从开发人员控制台窃取焦点。如果在控制台中运行以下代码,然后在之后在浏览器窗口中快速单击,则会在搜索框中看到它: setTimeout(function() { $('input[name="q"]').focu

美国

应使输入集中(激活)。我好像没法让它工作

即使在这个网站的控制台上,我也在尝试搜索框

$('input[name="q"]').focus()

我什么也得不到。有什么想法吗?

事实上,只要你不在控制台中集中注意力,你给出的专注于此网站的示例就可以了。这不起作用的原因很简单,因为它没有从开发人员控制台窃取焦点。如果在控制台中运行以下代码,然后在之后在浏览器窗口中快速单击,则会在搜索框中看到它:

setTimeout(function() { $('input[name="q"]').focus() }, 3000);

至于你的另一个,过去给我带来麻烦的一件事是事情的顺序。不能对尚未附加到DOM的元素调用focus()。您试图聚焦的元素是否已连接到DOM?

在网络上的其他位置找到了解决方案

$('#id').focus();
不起作用

$('#id').get(0).focus();

确实有用。

我意识到这很旧,但今天偶然发现了它。没有一个答案对我有效,我发现有效的答案是setTimeout。我希望使用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
解决方案,它也起了作用。但是,根据主机设备在确保目标元素可见的过程中的速度,任意选择的超时迟早会破坏解决方案。

其他解决方案在focus()中也存在同样的问题似乎不起作用,但最终证明需要滚动到正确的位置:


如果您使用bootstrap+modal,这对我很有用:

  $(myModal).modal('toggle');
  $(myModal).on('shown.bs.modal', function() {
    $('#modalSearchBox').focus()
  });

我也有这个问题。在我的例子中,有效的解决方案是在HTML元素上使用tabindex属性

我对列表中的某些li元素使用了
ng repeat
,但我无法使用.focus()将焦点移到第一个li,因此我只是在循环期间向每个li添加了tabindex属性

所以现在
  • +1是从0开始的索引。 在调用.focus()函数之前,还要确保元素存在于DOM中


    我希望这能有所帮助。

    以防其他人偶然发现这个问题,并遇到与我相同的情况-我试图在单击另一个元素后设置焦点,但焦点似乎不起作用。原来我只需要一个
    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();
    });
    
    这有助于:

    如果从mousedown事件处理程序调用HtmleElement.focus(),则必须调用event.preventDefault()以防止焦点离开HtmleElement。 资料来源:


    对于那些由于使用“$(element).show()”而无法工作的用户。我用下一种方法解决了这个问题:

     var textbox = $("#otherOption");
     textbox.show("fast", function () {
        textbox[0].focus();
      });
    
    因此,您不需要计时器,它将在show方法完成后执行。

    在focus()之前添加延迟。200毫秒就足够了

    function focusAndCursor(selector){
      var input = $(selector);
      setTimeout(function() {
        // this focus on last character if input isn't empty
        tmp = input.val(); input.focus().val("").blur().focus().val(tmp);
      }, 200);
    }
    

    对于我的例子,我必须指定一个选项卡索引(
    -1
    ,如果只能通过脚本聚焦)

    
    
    刚才又出现了这个问题,信不信由你,我所要做的就是关闭开发人员工具。显然,控制台选项卡的焦点优先于页面内容。

    确保元素及其父元素可见。
    您不能在隐藏元素上使用焦点。如果您想从dev控制台打开焦点,那么只需从options选项卡打开控制台作为一个单独的窗口。最新的Firefox和Chrome支持这一功能。

    我测试了Chrome的DevTool控制台的代码,但焦点部分没有工作。我后来发现,只有当我从DevTool运行它,并且如果我将代码实现到网站上,这个问题才会出现。
    实际上,元素得到了关注,但DevTool立即将其删除。

    在我的情况下,如果其他人遇到这种情况,我加载一个表单进行查看,用户单击“编辑”,ajax获取并返回值并更新表单

    就在这之后,我尝试了所有这些,除了:

    setTimeout(function() { $('input[name="q"]').focus() }, 3000);
    
    我不得不更改为(由于ajax):

    最后我只使用了$(“#q”),尽管它是一个输入:

    setTimeout(function () { $("#q").focus() }, 500);
    

    您可以尝试此
    id
    is
    trys

    window.location.hash = '#tries';
    

    我遇到了一个类似的问题,将事件包装在
    setTimout
    函数中对我来说非常有效。 但不知何故,这并不是解决问题的最佳方法(手动延迟事件)

    但是,在我的例子中,焦点事件没有触发,因为元素是不可见/隐藏的,并且在几毫秒后,当我在
    element.on(“focus”)
    函数中触发焦点事件时,该元素是可见的(这是在单击元素并将元素聚焦到中时触发的)

    这对我很有用:

    element.on(“焦点”,(e)=>{
    e、 预防默认值();
    if(eleme)
    
    setTimeout(function () { $("#q").focus() }, 500);
    
    window.location.hash = '#tries';