javascript - jQuery ('select:focus' ).blur() 在 Safari 和 Edge 中不工作

Question

我们网站上有一个页面，我们在页面加载 5 秒后显示一个叠加表单。如果我们点击页面中的任何一个选择元素展开，在 5 秒的时间跨度内等待 Overlay 表单出现，那么展开的选择元素就会与 Overlay 表单重叠。设计真的不好看。

为了解决这个问题，我们添加了一行代码来触发任何聚焦的选择元素上的模糊事件，该事件会关闭展开的选择元素。这在 Chrome、Firefox 和 Internet Explorer 中运行良好，但在 Safari 和 Edge 中却不行。我试图通过放置几个 hack 来解决这个问题，但没有一个工作正常。任何帮助将不胜感激!

var showOverlayForm = function () {
    setTimeout(function () {
        // Do something after 5 seconds
        // ANIMATE the overlay form.
        $('select:focus').blur(); //close any open select drop down 
    }, 5000);
};

Answer 1

您会注意到，当用户选择下拉控件时，它会添加 class=focused。

您可以尝试使用 .toggleClass() 并尝试删除该类可能会帮助您解决问题。

引用:

.toggleClass()

或者您可以尝试在屏幕上显示任何消息 5 秒或显示任何进度条以吸引用户 5 秒。