javascript - select事件不冒泡解释
问题描述
想请问下,select事件不会发生冒泡
当我的鼠标点击下拉框的时候为何会控制台出现 s1 d3 d2 d1
当我点击下拉框中的数字时 又会出现s1 d3 d2 d1
<!DOCTYPE html><html lang='en'><head> <meta charset='UTF-8'> <title>Document</title></head><body><p style = 'width:200px;height:200px;background-color:orange;'> <p style = 'width:175px;height:175px;background-color:yellow;'><p style = 'width:150px;height:150px;background-color:blue'> <select id='s1'> <option>1</option> <option>2</option> </select></p> </p></p></p> <script type='text/javascript'>function fun1(){console.log(event.currentTarget.id); }s1.addEventListener('click',fun1,false);d1.addEventListener('click',fun1,false);d2.addEventListener('click',fun1,false);d3.addEventListener('click',fun1,false); </script></body></html>
问题解答
回答1:你这不是点击事件触发产生的冒泡? 触发了两次是因为你打开下拉框一次,收起下拉框一次
回答2:首先,select事件会冒泡,但你的代码和select事件没啥关系,select事件其次,你控制台的输出是因为触发click事件冒泡产生的
相关文章:
1. index.php错误,求指点2. css - 手机qq打开网页无法使用文件上传功能?3. html5 - css3 scale 从0到1在有的手机上,图像会变模糊4. css3 - 微信下拉漏出文件来源怎么禁止 页面中仍有需要滚动的地方5. 一个PHP文件在中英不同状态怎么运行对应的JS文件6. python小白,问一个关于可变类型和不可变类型底层的问题7. html5 - 页面在手机屏幕触摸下拉会刷新是怎么回事8. 浏览器空白html文档报未定义join错9. javascript - vue 2.0 @click.self 不触发10. angular.js - Angular开发的单页面应用,如何正确地实现在微信里的网页授权和调用js sdk
