focus不支持冒泡是什么意思?

focus不支持冒泡是什么意思?

<div id="box">
<input type="text" id="input">
</div>
var box = document.getElementById('box');
var input = document.getElementById('input');

box.addEventListener('click',function(e){
console.log('box')
})
input.addEventListener('focus',function(e){
console.log('input')
})

上述代码,我点击输入框(触发focus),控制台依然会按照“子-父”的顺序输出内容。

不支持冒泡的话,不是应该只输出input触发focus的内容吗?

正在回答

登陆购买课程后可参与讨论,去登陆

1回答

你好同学,focus是不冒泡的。当点击输入框的时候才会获得焦点,所以input同时触发了获得焦点和点击两个行为,即触发冒泡的是点击事件,并不是focus。

当点击input后,开始向外层元素查,查到父元素绑了click事件,就执行它。所以也要注意一些,冒泡发生在同一类型的事件中。假设focus会冒泡,也是会冒泡查找父元素的focus事件哦。

另外,你可以打开页面,按tab键,这样也可以获得input的焦点,此时没有鼠标点击它,会发现只执行了子元素的事件哦。

祝学习愉快 ,望采纳。

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师