使用 jQuery 的 .focus() 在 Mac 上的 Firefox 中设置焦点

2023-12-02

我想得到.focus()在 Mac 上使用 Firefox(版本 33.1.1)。一些类似的问题提到了具有以下效果的解决方案.focus()没有视觉效果;通过下面的每项测试,我什至无法完成这一任务。

下面列出的各种测试都适用于 Chrome,但不适用于 Firefox。使用的 HTML 是:

<input type="text" id="test" tabindex="1">

Setting tabindex是基于这个建议,但似乎没有任何效果。

我也考虑过使用autofocus,但这行不通,因为我需要在用户使用网页时操纵多个字段的焦点,而不仅仅是加载时的单个字段。

Update: Rhumborl建议below该问题可能与 Firefox 在使用 iframe 时对焦点事件的处理有关,果然这似乎就是问题所在。当您将其从 JSFiddle 的 iframe“编辑小提琴”窗口中取出并全屏查看输出时,以下每个测试都有效。下面我添加了每个版本的全屏工作版本的链接。

A. .focus()

$("#test").focus();

Fiddle (update: 这适用于全屏).

B. setTimeout with .focus()

setTimeout(function(){
    $("#test").focus();
},100);

Fiddle (update: 这适用于全屏)。按照建议here, here, and here.

C. .trigger('focus')

$("#test").trigger('focus');

Fiddle (update: 这适用于全屏)。按照建议here.

D. setTimeout with .trigger('focus')

setTimeout(function(){
   $("#test").trigger('focus');
},100);

Fiddle (update: 这适用于全屏)。按照建议here.

E. 纯 JavaScript

document.getElementById("test").focus();

Fiddle (update: 这适用于全屏).

F. setTimeout使用纯 JavaScript

setTimeout('document.getElementById("test").focus();',100)

Fiddle (update: 这适用于全屏)。按照建议here.

G. .select()

$("#test").select();

Fiddle (update: 这适用于全屏)。按照建议here.

H. setTimeout with .select()

setTimeout(function(){
   $("#test").select();
},100);

Fiddle (update: 这适用于全屏).

这可能是 Mozilla 需要解决的问题(请参阅here),但似乎确实有解决方法。例如,如果您去谷歌网站在 Mac 上的 Firefox 中,焦点位于input领域(我无法弄清楚谷歌是如何做到这一点的,尽管他们似乎正在处理焦点这个脚本).

那么有人知道解决方法吗?


<input type="text" id="test" autofocus="autofocus">

如果您将自动对焦属性添加到输入中,它可能会执行您想要执行的操作。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 jQuery 的 .focus() 在 Mac 上的 Firefox 中设置焦点 的相关文章

  • Blueimp jQuery 文件上传,传递额外的表单数据

    我可以使用一些帮助 我已经设法使 blueimp jQuery 文件上传为我工作 但我仍然绝对是一个新手 我对 jQuery 等知之甚少 所以请尝试将其清晰明了地提供给我尽可能简单 我会尝试具体一点 好的 我想实现的是人们可以上传照片 并为
  • 为什么“dtoa.c”包含这么多代码?

    我将是第一个承认我对低级编程的整体知识有点稀疏的人 我理解许多核心概念 但我不经常使用它们 话虽这么说 我对需要多少代码感到非常惊讶dtoa c http www netlib org fp dtoa c 在过去的几个月里 我一直致力于用
  • JSDoc:如何在生成的文档中包含自定义 css 文件模板?

    JS文档docs https jsdoc app about configuring default template html say 将图像目录复制到输出目录 复制全部 将 myproject static 中的静态文件复制到输出目录
  • JointJS - 处理链接删除点击

    创建链接后 将鼠标悬停在其上会显示红色 X 以将其删除 单击此按钮将触发一系列事件 通过订阅 全部 活动收集 单元格 向下指针 链接 向下指针 cell pointermove x5 似乎可疑 单元格 指针向上 在浏览了文档并花费了太长时间
  • Angular-Datatables + Angular-xeditable:取消可编辑行

    当组合 Angular DataTables 和 Angular XEditable 时 添加新行时会取消可编辑行 这是jsfiddle https jsfiddle net faj61h5d 10 示例操作如下 1 这是初始状态 2 将第
  • 如何用 jQuery 替换击键?

    我需要能够用 jQuery 替换击键 当按下右箭头时 我希望改为按下 Tab 键 到目前为止我有
  • 有没有办法在 TypeScript 2+ 中全局添加类型定义?

    我有一堆简单的 ts files 不是项目 即独立的 ts 脚本 他们使用一些 Node js 功能 TypeScript 和节点类型定义通过安装 npm install g typescript npm install g types n
  • 用于导出到 CSV/Excel 的数据 URI(无服务器端请求):浏览器支持/限制?

    以下问题 Javascript 或 Flash 导出至 CSV Excel https stackoverflow com questions 8150516 javascript or flash export to csv excel
  • 在外部单击时关闭弹出 div

    我有一个弹出 div 仅在单击特定按钮时显示 单击同一按钮时它甚至会隐藏 我的问题是 我还想在单击外部任何地方时隐藏 div 我无法这样做 因为弹出 div 位于主包装类内部 并且无法通过在包装类上使用 click 事件并使其隐藏来做到这一
  • while 循环元素状态 cypress

    我有一个问题 我想单击一个按钮直到它消失 但次数可能会有所不同 所以我想检查可见性状态 当可见 true时单击按钮 当可见 false时结束测试 但问题是我不知道如何循环从获取元素到末尾的所有链 单击按钮一次 由于中断而停止 如果我删除中断
  • 有不同图像尺寸的缩略图 Bootstrap

    我想要包含不同大小和不同文本量的图像的缩略图 但我希望它们都具有相同的大小 像这样来自 Bootstrap 站点的示例 http getbootstrap com components thumbnails custom content 下
  • 单击react.js 切换列表的背景颜色

    我正在尝试创建一个具有以下功能的列表 悬停时更改列表项的背景颜色 单击时更改列表项的背景颜色 在单击的元素之间切换背景颜色 即列表中只有一个元素可以具有 clicked 属性 我已经执行了 onhover 1 和 2 功能 但无法实现第三个
  • nvd3.js - 无法更改折线图中线条的颜色

    我正在尝试更改 nvd3 折线图不同线条的颜色here http nvd3 org livecode index html codemirrorNav但我无法理解该怎么做 我想将示例中的 2 条线的颜色更改为绿色和青色 我试过 nv add
  • 在浏览器上录制视频并上传到LAMP服务器

    我已经尝试了很多东西 red5 jquery 网络摄像头 html5 但这些解决方案都没有录制视频并准备好上传到服务器 无论如何 html5 flash 等等 更好的跨浏览器解决方案 最好的 上传视频 音频 并将结果上传到服务器 我猜是通过
  • 使用 JavaScript 从 URL 变量读取来加载不同的 CSS 样式表

    我试图在我的 WordPress 博客上使用两个不同的样式表 以便在通过 Web 访问页面时使用一个样式表 而在通过我们的 iOS 应用程序访问博客内容时使用另一个样式表 现在 我们将 app true 附加到来自 iOS 应用程序的 UR
  • 如何在 ChartJS 中创建自定义图例

    我需要使用 ChartJS 库为我的圆环图创建自定义图例 我已经使用 ChartJS 提供的默认图例创建了甜甜圈 但我需要一些修改 我希望其价值高于汽车名称 另外 我不喜欢粘性图例 我想将其与甜甜圈分开 这样我就可以更改字体 框的样式 例如
  • Chrome Prerender 功能每次都会被取消

    我正在尝试 Chrome 中的预渲染功能 但是当我检查网络时 我可以看到任何链接的请求都被取消 我使用以下语法 我尝试了现场演示http prerender test appspot com http prerender test apps
  • 从 Node.js 调用 execl、execle、execlp、execv、execvP 或 execvp 的方法

    POSIX 系统公开了一系列exec函数 允许人们将可能不同的东西加载到当前进程中 保留打开的文件描述符 进程标识符等 可以出于多种原因执行此操作 在我的情况下 这是引导 我想更改我自己的进程的命令行选项 然后在现有进程上重新加载它 这样就
  • 我可以防止将 Leaflet 地图平移到世界边缘之外吗?

    有没有办法限制平移到世界边缘之外 在这幅画中 棕色是世界 灰色是虚空 我想让它不可能像这样平移 Leaflet 允许您控制地图抵抗被拖出边界的程度maxBoundsViscosity选项 值 0 到 1 将其设置为最大值会完全禁用拖动出界
  • 使用 stopPropagation() 处理 React 事件委托

    我有一个 React 项目 应该可以放置在任何网站上 我的想法是 我托管一个 javascript 文件 人们放置一个具有特定 ID 的 div 然后 React 在该 div 中进行渲染 到目前为止 除了点击事件之外 这是有效的 这些事件

随机推荐

  • 等待 Firebase 检索数据[重复]

    这个问题在这里已经有答案了 我想构建一个返回a的方法childFirebase 中的值 我尝试做这样的事情 public String getMessage root child MessagesOnLaunch child Message
  • 通过RedBean批量插入mysql

    如何运行以下sqlRedBean INSERT INTO tbl name a b c VALUES 1 2 3 4 5 6 7 8 9 我应该使用循环还是RedBean支持批量插入 RedBeanPHP 的创建者在这里 RedBeanPH
  • 在 Adob​​e AIR for iOS 中获取唯一标识符(MAC 地址、UDID 等)

    我正在尝试在适用于 Android 和 iOS iPad 2 的 Adob e AIR 应用程序中获取用户设备网络适配器的 MAC 地址 在 Android 中它可以正常工作 但在 iOS 中却不能 这是我正在使用的代码 var vNetw
  • 从unittest.TestCase切换到tf.test.TestCase后的幻像测试

    以下代码 class BoxListOpsTest unittest TestCase Tests for common bounding box operations
  • Sparklyr:如何将列表列分解为 Spark 表中自己的列?

    我的问题与中的问题类似here 但我在实现答案时遇到问题 并且我无法在该线程中发表评论 因此 我有一个包含嵌套数据的大 CSV 文件 其中包含由空格分隔的 2 列 假设第一列是 Y 第二列是 X X 列本身也是一个逗号分隔值 21 66 2
  • OS X Yosemite 中 setenv 和 getenv 的奇怪行为

    当我设置环境变量时 launchctl setenv FOO test 我可以通过以下方式获取值 launchctl getenv FOO 这返回我 测试 但是一个简单的 echo FOO 不替换 结果为空 在同一航站楼以及新航站楼中 背景
  • 全局变量被炼金术打破了?

    看起来Adobe炼金术没有运行全局构造函数 这是一些简单的测试代码 include
  • 更改通过 JsonExtensionData 加载的数据的键名称[重复]

    这个问题在这里已经有答案了 我有一个由系统数据和用户条目混合而成的 JSON 如下所示 Properties Type A Name aaa lorem ipsum 7 1 Type B Name bbb sit amet XYZ Type
  • 根据文件扩展名验证文件

    我从 Java 队列中获取文件 它们可能具有以下格式 docx pdf doc xls xlsx txt rtf 阅读它们的扩展名后 我想验证它们是否确实是这些类型的文件 例如 我收到一个文件并检查其扩展名是否为 xls 之后 我想检查它是
  • 在打印机兼容的设备上下文中调用 Windows SelectObject 返回 NULL

    最近的 Windows 10 更新 可能也是神秘的 KB4577586 似乎已经产生了引起调用的效果选择对象使用位图句柄作为参数 在打印机兼容的设备上下文中执行时返回 NULL 相关行可以在这个中看到位图打印示例 它在早期的 Windows
  • 从字节码解析类名

    是否可以从类源代码形成的字节码中挖掘类名称 情况是这样的 我从某个地方远程获取类字节码 它来自哪里并不重要 为了使用类加载器有效地加载该类 我还需要类名 对吗 如果您只需要类名 那么您自己解析类文件的开头可能会更容易 而不是为此目的添加用于
  • R 语言:使用 ff 包计算“group by”或拆分时出现问题

    我对 R 几乎是新手 很抱歉如果我提出一些基本问题 但我找不到这个 简单 问题的解决方案 我有一个患者数据库 大数据库 2500 万行 14 列 每个 id 有几行 例如以下结构 id birth date treatment date t
  • processing.js 加载外部文件

    我想将我的processing js 代码分割成几个文件 但我不知道如何分割 我尝试做
  • Flow Router 不适用于 ObjectID。有什么解决办法吗?

    我正在尝试在我的 Meteor 应用程序中构建路线 路由工作得很好 但使用路由路径从数据库获取信息却不起作用 我用这个创建我的页面特定路线 FlowRouter route level id 这条路线将我毫无问题地带到相关模板 然后我想从数
  • 位图区域已被锁定,多线程环境

    我正在使用一个通过多个线程调用主函数的 API 我试图通过该函数访问另一个类中的位图并从中写入 但即使将其设置为使用完全不同的对象实例后 我也遇到了 InvalidOperationException 位图区域已被锁定 我尝试在主函数和调用
  • 相当于 Office-js Excel 加载项中的 Application.ScreenUpdating 属性

    我正在将大量数据插入工作表中 这样做时屏幕会闪烁 在 VBA 和 com 加载项中 我可以设置一个属性来延迟更新 直到更新完成 Office js excel 加载项中是否有与 Application ScreenUpdating 属性等效
  • 如何在flutter中获得像facebook一样的微光效果?

    我正在尝试创建一个视频流应用程序并想要像 facebook 那样的微光效果 有什么建议如何获得它吗 微光 1 0 1 开启https pub dev packages shimmer 一个包提供了在Flutter项目中添加微光效果的简单方法
  • didSelectViewController 在某些情况下不会被调用

    我遇到了很多人已经报告过的问题 didSelectViewController不会被调用 但就我而言 有时会被调用 我有三个选项卡和三个视图控制器 每次用户按下第二个或第三个选项卡时 我都需要执行一些代码 在我的 SecondViewCon
  • 在android中使用webview将CSS注入到网站

    例如我想改变背景颜色www google comto red 我用过webview 和我的style css文件位于assest folder 我想注入这个style css文件至www google com 我的代码有什么问题吗 请为我写
  • 使用 jQuery 的 .focus() 在 Mac 上的 Firefox 中设置焦点

    我想得到 focus 在 Mac 上使用 Firefox 版本 33 1 1 一些类似的问题提到了具有以下效果的解决方案 focus 没有视觉效果 通过下面的每项测试 我什至无法完成这一任务 下面列出的各种测试都适用于 Chrome 但不适