0
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr" lang="en">
<head>
    <script src="../js/third_party/jq142unmin.js"></script>
    <script>
        $(document).ready( function(){
            $("#set_focus1").click(function(){
                console.log($("#input1").focus());
            });
            $("#set_focus2").click(function(){
                console.log($("#input2").focus());
            });
        });
    </script>
</head>
<body>
    <input id="input1"></input>
    <input id="input2"></input>
    <button id="set_focus1">Set Focus1</button>
    <button id="set_focus2">Set Focus2</button>
</body>
</html>

在此处输入图像描述

代码本身就像我认为的那样工作,例如,单击按钮将焦点集中在一个输入或另一个上。但是如果我从控制台尝试同样的事情,它没有任何效果(没有错误消息,只是什么都不做)。如上所示,我尝试了几种不同的方法。

在这些输入元素上从控制台执行的其他 jQuery 函数,例如。$("#input1").val("foo"),就像我期望的那样工作。focus() 有什么不同?

4

2 回答 2

1

我刚刚复制了这个,这不是错误,它只是浏览器如何处理您的输入。当您使用开发人员工具时,该页面没有您的标线,因此不会将其传递给另一个元素。

该元素实际上确实得到了“聚焦”。在您的浏览器中运行它,您会看到该focus()事件确实触发了,但是当您注意另一个窗口时,浏览器不会强制您切换到该页面。

$("#input1").on("focus", function(){  alert("focused")  });
$("#input1").focus();

这将触发警报。

于 2013-01-23T20:26:35.093 回答
0

控制台与浏览器窗口是分开的。所以当你在控制台执行一些命令时,焦点不会移动到html窗口。这就是为什么你没有得到预期的结果。

$("#input1").val("foo")正在设置 DOM 元素的值。因此它将更改值并将光标保留在控制台中。

要验证$("#input1").focus()您可以在焦点事件中放置一个警报,然后从控制台调用该事件。

于 2013-01-23T20:28:22.467 回答