编程技术记录

世界你好!

环境:

  • iOS 13.2 + WKWebView

现象一:
当不添加viewport时,onfocus被触发一次

<!DOCTYPE html>
<html>
    <head>
        <script>
            function onfocus123(e){
                console.log(456);
            }
        </script>
    </head>
    <body>
        <span>test_input</span>
        <input id="test_input" type="text" onfocus="onfocus123(event)">
    </body>
</html>
第一次点击input输入框 第二次点击input输入框
输出:456 输出: 456

现象一:
当添加viewport时,onfocus被触发两次

<!DOCTYPE html>
<html>
    <head>
        <script>
            function onfocus123(e){
                console.log(456);
            }
        </script>
        <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover,user-scalable=no">
    </head>
    <body>
        <span>test_input</span>
        <input id="test_input" type="text" onfocus="onfocus123(event)">
    </body>
</html>
第一次点击input输入框 第二次点击input输入框
输出:456 456 输出: 456

暂时没有比较好的解决办法。

另,参考https://patrickhlauke.github.io/touch/tests/results/,

There is some oddity/bug in iOS 12.2, with ,  and  being fired twice when first tapping on the control. The experimental WebKit feature for pointer events also generates some duplicate pointerup events.

可知,基于WebKit的浏览器如WKWebView,Safari,在一些版本上(如12.2)会有奇怪的bug,事件mousedownmouseupclick在第一次进入控件时会被触发两次。

其他相关讨论可见https://greensock.com/forums/topic/21397-ios-13-safariwkwebview-draggable-double-dispatching-click-events/

© Beli. All Rights Reserved.