对于input输入框，mousedown、mouseup、click和focus事件的发生顺序

本文链接：https://blog.csdn.net/sinat_36521655/article/details/82227498

今天拼多多笔试遇到了这道题，对于点击事件，是按照mousedown -> mouseup -> click这个顺序走的，但是focus事件的顺序就不清楚了，当时凭直觉选了mousedown -> focus -> mouseup -> click这个答案，笔试完成后，测试了一波，发现男人的直觉有时还是可信的。

哈哈哈，当然是开个玩笑，不了解的地方还是需要去验证的。

下面是测试代码

<!doctype html>
<html>
<head>
</head>
<body>
    <input type="text" id="test" />
    <script>
        var input = document.getElementById("test");
        addListener(input, "mousedown", function() {
            console.log("mousedown");
        });
        addListener(input, "mouseup", function() {
            console.log("mouseup");
        });
        addListener(input, "click", function() {
            console.log("click");
        });
        addListener(input, "focus", function() {
            console.log("focus");
        });
        
        function addListener(dom, event, func) {
            if(dom.addEventListener) {
                dom.addEventListener(event, func);
            } else if(dom.attachEvent) {
                dom.attachEvent("on"+event, func);
            } else {
                dom["on"+event] = func;
            }
        }

    </script>
</body>
</html>

结果如下：