【问题标题】:How to put your cursor in the input tab如何将光标放在输入选项卡中
【发布时间】:2018-11-23 21:34:35
【问题描述】:

Google 中,我输入了代码document.querySelector('[aria-label="Search"]').select(); 如何将光标放在控制台日志的输入选项卡中,以查看是否选择了谷歌的输入选项卡。我确认我正确调用了输入选项卡,但控制台日志只是说 undefined 如何使用 javascript 将光标放在输入选项卡中。如果不能是javascript,还请分享如何将光标放在输入标签中

【问题讨论】:

  • 我不确定您要做什么。您是否尝试console.log 输入的值?记录 document.querySelector('[aria-label="Search"]').select(); 应该记录 undefined 因为它没有返回值。

标签: javascript jquery


【解决方案1】:

您的代码是正确的。您的问题实际上有两个部分:

为什么运行.select()后控制台显示undefined

要理解undefined,了解控制台的工作原理很重要。当您在控制台中输入表达式时,它会使用eval 运行它并显示结果。例如:

  • 1 + 3 评估为 4
  • var a = 1 + 3 计算结果为 undefined,即使定义了变量
  • alert("hello") 的计算结果为 undefined,即使显示了警报

在您的示例中,HTMLInputElement.select() 不返回任何内容,因此控制台仅显示 undefined。话虽如此,代码确实运行了。您可以通过使用控制台显示 alert 来验证这一点。

(如果您对控制台如何决定作为表达式结果显示什么的细节感兴趣,我会看看this answer。)

为什么使用控制台运行.select() 时搜索栏没有焦点?

对于您问题的这一部分,我建议您尝试使用您控制的页面的来源。请注意,如果您在文本字段上设置一个按钮以调用 .select(),则该字段将聚焦。如果您使用控制台运行相同的代码,该字段将不会聚焦。

虽然我不确定具体细节,但这似乎是因为开发人员工具拒绝在用户没有专门单击不同元素或关闭它们的情况下失去焦点。如果您改为将表达式包装在超时中并在超时执行之前更改焦点,您的代码将按预期工作。

您可以通过以下操作在您的网页和 Google 的网页上验证这一点:

  1. 使用控制台运行:

    setTimeout(() => document.querySelector('[aria-label="Search"]').select(), 2000)
    
  2. 快速点击页面背景退出开发者工具焦点。

  3. 观察该字段在超时执行时聚焦。

【讨论】:

    猜你喜欢
    • 2019-11-09
    • 1970-01-01
    • 2023-03-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-04-11
    • 1970-01-01
    相关资源
    最近更新 更多