在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ 父元素不能捕獲input的focus事件?

父元素不能捕獲input的focus事件?

在一次實(shí)驗(yàn)中突然發(fā)現(xiàn),父元素通過addeventlisten不能捕獲input的focus事件。但是click事件可以正常捕獲。查了很多資料,并沒有發(fā)現(xiàn)原因,有沒有大佬能解答一下?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>


<div id="parent">

    <p>第1條元素</p>
    <p>第2條元素</p>
    <p>第3條元素</p>
    <p>第4條元素</p>
    <p>第5條元素</p>


    <input type="text" value="第1個輸入框">
    <input type="text" value="第2個輸入框">
    <input type="text" value="第3個輸入框">
    <input type="text" value="第4個輸入框">
    <input type="text" value="第5個輸入框">

</div>

<script>
    var aa = document.querySelector("#parent");
    var bb = function () {

    };
    
    bb.prototype.control = function () {
        
        aa.addEventListener("blur", function (e) {

            console.log(e);

        })

    }

    var cc = new bb;

    cc.control();


</script>

</body>
</html>

圖片描述

圖片描述

回答
編輯回答
落殤

focus沒有冒泡

2017年11月12日 22:47
編輯回答
深記你

是因?yàn)檫@兩個事件不會冒泡。
詳見MDN
clipboard.png

2017年6月29日 16:35
編輯回答
獨(dú)特范

默認(rèn)情況下div無法獲取焦點(diǎn),無法觸發(fā)focus與blur事件
如何使div觸發(fā)blur事件:可以給div加上tabindex屬性

<div id="parent" tabindex="0">
2017年12月17日 05:15