我有一个非常非常奇怪的问题，似乎只是Chrome中的一个问题。 当用户访问网站时，用户无法聚焦任何元素(通过鼠标单击，如果他们通过选项卡聚焦它，元素也不会获得"聚焦"状态)，这只是 Chrome 中的一个问题。也就是说，直到用户调整窗口大小、最小化窗口、打开新选项卡、打开开发人员工具等。重新加载页面不执行任何操作。但是，一旦焦点"启用"，用户就可以使用清除缓存等进行导航/刷新，关闭浏览器并再次打开它，一切正常 - 元素正常获得"焦点"状态。
此行为只能在 Chrome 中重现，而不能在本地主机上重现。
本地主机和测试版环境的区别在于：
- Beta env 需要身份验证(基本 HTTP 身份验证)
- 开发环境中的文件包含在单个JS和单个CSS文件中，并且两者都被最小化
- beta env 包含 hotjar，而 localhost 上没有 hotjar
没有将侦听"调整大小"事件的自定义事件侦听器。控制台中没有错误，所有不依赖于焦点元素状态的 javascript 都会正确执行。悬停事件和依赖于悬停状态的所有 CSS 样式都可以正常工作。
主要问题是，必须填写并包含日期选择器的表单无法填写，因此用户无法真正与页面交互。日期选择器不会打开，并且由于输入元素没有获得焦点状态，因此它们不会在视觉上发生变化(CSS ：focus选择器也不起作用)，因此给用户的印象是他们无法键入普通文本输入(这有效，单击输入后，可以键入输入)。
我尝试删除热罐，但问题仍然存在。唯一使问题消失的是删除基本身份验证，但是，在此阶段这不是一个选项(这是一个封闭的beta测试，因此我们需要将访问权限限制为仅具有密码的用户)。 我还发现基本身份验证会干扰元素的聚焦状态非常奇怪，尤其是因为刷新后错误仍然存在，并且只有在您与浏览器本身交互后才会消失(最小化、打开新选项卡、执行任何调整浏览器窗口或文档大小的操作)，之后它正常工作并且没有任何错误。
这个问题最近才开始出现，但我不认为这是应用程序本身的问题，因为我尝试回滚到几个月前的版本并且问题仍然存在。所有这些都让我相信这是Chrome中的一个错误，但是可以做些什么来修复它？
编辑：我还尝试将自动对焦属性添加到输入元素，但在测试环境中，它没有得到焦点。
因此，它似乎确实是一个Chrome错误，既存在于移动(Android和iOS)Chrome浏览器上，也存在于桌面Chrome浏览器(在Windows和Mac上都经过测试)。我提交了官方错误报告。在错误报告中，一个其他用户制作了一个只能通过基本身份验证访问的网站，并且只有 2 个基本输入，输入应该在焦点上有一个红色边框。正如预期的那样，在 Chrome 中打开网页后(为了易于使用 - 隐身模式)，输入不会获得焦点，边框也不会改变。
对于那些在Chrome中也受到此错误影响的用户，您可以在此处跟踪错误进度：https://bugs.chromium.org/p/chromium/issues/detail?id=740652
同时，对于那些感兴趣的人，这里有一个黑客解决方案：
$(document).on("ready", function() {
var $inputs = $("input");
$inputs.off("click.trick");
if (!sessionStorage.fixedChromeFocus) {
sessionStorage.fixedChromeFocus = "true";
$inputs.on("click.trick", function() {
var win = window.open("/", "_blank");
setTimeout(function() {win.close()}, 1);
$inputs.off("click.trick");
});
}
});
目标是以某种方式与当前页面之外的浏览器进行交互，使其以某种方式失去焦点。您不能使用 JS 来最小化浏览器，不能调整它的大小，不能打开开发工具。不过，您可以做的是打开一个新窗口。当然，如果您立即打开一个新窗口，弹出窗口阻止程序(大多数人都有它)会阻止它，并且窗口本身(或者更确切地说是您当前的选项卡)不会失去焦点。打开新窗口只能作为对用户事件的反应(不会触发潜在的弹出窗口阻止程序)。
我还使用了一些浏览器检测，因此代码将仅用于Chrome，并且使用服务器端调节，仅适用于包含基本身份验证的版本。 不言而喻，代码的作用是，只要用户单击输入，它就会打开一个新选项卡并在 1 毫秒后快速关闭它。为了防止这种情况一直发生，在每次页面加载时，都会使用 sessionStorage，该存储空间会在关闭该域的选项卡后自动清除(我们已经确定，一旦焦点开始正常工作，只要您保持浏览器打开，它就会工作)。
此代码的效果是，用户在第一次单击输入时会看到快速的白色闪烁，但一切都会正常工作