自动对焦时光标不闪烁

Posted 2023-02-19

【中文标题】自动对焦时光标不闪烁

【英文标题】：Cursor does not blink on autofocus

【发布时间】：2018-01-04 02:21:32

【问题描述】：

浏览器：Chrome > 57

问题：

光标不会在焦点文本框上闪烁（左/右键单击不会使光标开始闪烁）

步骤：

当您从“您的连接不是私密的”（又称不安全页面）继续时发生。

仅当您获得警告页面（自签名证书页面）并通过单击 proceed to （不安全） 继续时才会发生 - 该问题不会发生下次刷新时（因为警告页面不再出现）

我尝试过的， 试过了

html 方式，输入文本框上的 autofocus="autofocus" javascript 方式，$(id).focus()。在超时后也尝试设置焦点。

以上方法都不起作用（我第一次访问该页面 - 在警告页面之后）。 焦点实际上已设置/工作，只是闪烁不起作用。

仅供参考：Chrome 从版本 58 及更高版本更新了一些安全更改（详情 1、2）。不确定这些更改是否/为什么会影响光标闪烁的方式，但我已经检查了 Chrome 56/57 并且闪烁工作正常。

例如，不想链接任何不安全的网站来演示这个。我面临的问题是私人软件安装 - 自签名证书（必需），并且光标闪烁（在焦点元素上）不起作用。

【问题讨论】：

如果您是站点管理员，可能需要先处理安全问题。显然，正如您所指出的，一旦您处理了这个问题，其他问题就不会发生。此外，您可能会发现没有人会访问您的网站，甚至如果他们看到的第一件事是亮红色警告屏幕告诉他们不应访问，甚至会注意到该错误。

该站点位于专用网络（安全）上。外部无法访问。

在这种情况下，网站是否有任何理由需要通过 HTTPS 运行？如果不是，请切换到 HTTP 并且不要使用自签名证书。问题解决了。

我也有同样的问题。仅当您来自“您的连接不是私人的”页面时才会发生，光标不会闪烁但输入有效。我怀疑onFocus 和onBlur 处理程序也不起作用。下次不会发生这种情况，如果您更改选项卡，则会修复。

提出了一个关于铬的问题 - here

【参考方案1】：

https://developer.mozilla.org/en-US/docs/Web/CSS/caret-color

可能是因为新的更新。

一个例子：http://www.developphp.com/lib/CSS/caret-color

【讨论】：

问题不在于焦点不起作用。问题是即使文本框获得焦点也不会发生闪烁。

@VivekChandra 你能检查一下我给它的链接吗？它看起来像是与 chrome 57 版本集成的 css 的插入符号颜色属性。 caret-color: #000;

@berkaykılıç 太棒了，你的回答帮助了我

这个东西对我有帮助，但只有少数输入字段有问题，其他人都很好，知道吗？

【参考方案2】：

我遇到了类似的问题 - 作为 SVG 产品的一部分，外部对象中的文本字段。我的解决方案是在给输入字段焦点之前将光标设置（强制）为自动。

document.body.style.cursor = 'auto';
$(id).focus();