为什么模糊和聚焦在 Safari 上不起作用？

Question

为什么模糊和聚焦在 Safari 上不起作用？

O. *_*dze 4 html javascript css safari macos

我有这样的简单按钮：

<button class="emoji-button-container" onblur="APP.hideEmojiContainer()" onclick="APP.toggleEmojiContainer()">

Run Code Online (Sandbox Code Playgroud)

在 Chrome 上，这两个事件都可以完美运行。

在 Safari 上，onclick 事件可以正常工作，但不会触发 onblur 事件。此外 element.blur() 函数不会触发 onblur 事件。我需要它像在 Chrome 上一样在 Safari 上工作，那我该怎么办？这里有什么问题？

Answer 1

Rom*_*man 6

似乎 Safari 没有在单击时聚焦按钮元素。因此，根据定义， onblur 属性在元素失去焦点的那一刻触发。元素未聚焦 => onblur 不触发。

button.focus()单击后可以手动应用其中一种解决方案。

另一种是将附加click事件document作为这里

Answer 2

小智 5

在 Safari 上，按钮可能不会聚焦在点击上（并且因为它们没有聚焦，所以它们不会触发模糊）

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Clicking_and_focus

您可以使用 javascript 聚焦按钮

<!DOCTYPE html>
<html lang="en">
    <head>
        <script type="text/javascript">
            function clickFunc(event) {
                console.log(event, 'click');
                event.target.focus();// Add me
            };

            function blurFunc(event) {
                console.log(event, 'blur');
            };
        </script>
    </head>

    <body>
        <button class="emoji-button-container" onblur="blurFunc(event)" onclick="clickFunc(event)"></button>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	5 年，7 月前
查看次数：	2308 次
最近记录：	5 年，7 月前