社区
Web 开发
帖子详情
DIV失去焦点是触发事件(如果焦点在DIV的子元素上面也不能触发事件)
sinat_33842977
2016-11-07 11:19:29
div 里面放了一个input 我用js写了一个div失去焦点后的事件,但是该事件在点击内部的input后也会触发,如何阻止内部元素触发div的blur事件
...全文
909
4
打赏
收藏
DIV失去焦点是触发事件(如果焦点在DIV的子元素上面也不能触发事件)
div 里面放了一个input 我用js写了一个div失去焦点后的事件,但是该事件在点击内部的input后也会触发,如何阻止内部元素触发div的blur事件
复制链接
扫一扫
分享
转发到动态
举报
写回复
配置赞助广告
用AI写文章
4 条
回复
切换为时间正序
请发表友善的回复…
发表回复
打赏红包
qq_35447146
2017-12-13
打赏
举报
回复
我也遇到类似的问题了,div下有checkbox,想既点击checkbox又不让外层div失焦,找了半天,试出了一种方法 <input type="checkbox" onmousedown="c(this);"/> <script> function c(e){ if ( e && e.preventDefault ){ e.preventDefault(); }else{ window.event.returnValue = false; } } </script> 通过文章https://wenku.baidu.com/view/66dc603043323968011c9229.html https://segmentfault.com/q/1010000003015684解决的,希望能帮到需要用到的人
伫望-向北
2016-11-07
打赏
举报
回复
可以取消冒泡事件.
vswen5
2016-11-07
打赏
举报
回复
$("#div").not("input").focusout(function(){});
sinat_33842977
2016-11-07
打赏
举报
回复
引用 1 楼 zhuwangxiangbie 的回复:
可以取消冒泡事件.
能帮忙写一下方法么,网上找了好多都没起作用
div
失去
焦点
事件onblur()不触发解决方法
做一个弹出框组件,文字点击时会在文字下方弹出一个框,在vue3中监听
div
元素的blur事件发现事件并不会在
div
失去
焦点
时触发。bug原因:在vue中
div
默认不
触发事件
,除非将元素添加。在react中
div
元素是能触发onblur事件的。属性才会触发blur事件。
接收
子元素
focus_
div
元素获取
焦点
触发focus事件
通常情况下表单元素获取
焦点
后就可以触发focus事件,这一点在各个浏览器都是没有任何问题。但很多元素无法获取
焦点
,比如
div
元素,就算是为它注册focus事件处理函数,也是无法触发此事件。下面通过代码实例介绍一下如何让
div
触发focus事件。代码实例如下:[HTML] 纯文本查看 复制代码运行代码蚂蚁部落#the
div
{padding:10px;width:100px;height:100px;...
Vue中
失去
焦点
时所触发的事件
Vue中
失去
焦点
时所触发的事件 1-html、
失去
焦点
<input type="text" onBlur="txtblur()"> <script> function txtblur(event){ //当前元素
失去
焦点
console.log(123); } </script> 2-vue2.0、
失去
焦点
@input 一般用于监听事件,只要输入的值变化了就会触发input <input :type="typ
div
失去
焦点
vue_
DIV
的
失去
焦点
(blur)实现方法
用防抖实现
DIV
鼠标移出消失由于
div
标签本身不支持onblur事件,所以对于点击一个按钮弹出的
div
,我们想要当这个
div
失去
焦点
的时候,让它消失
不能
使用的onblur来实现。但是可以利用onmouseout和事件来实现
DIV
失去
焦点
消失的功能。直接使用onmouseout来实现移出消失可能会有一个问题:假设你的按钮的位置和弹出的
div
的位置不是重合的那么会导致鼠标移动就会马上去触发onmous...
点击
子元素
却也触发父元素的点击事件
在前端开发时,经常出现父元素有点击事件,
子元素
也有点击事件,在点击
子元素
时却会把父元素的点击事件也触发,这种情况叫做事件冒泡,解决的方案有很多种,这里记录一下比较常用,比较好用的一种解决方案 HTML 代码 父元素 <
div
id="father" style="width:600px;height:400px;border:1px solid black;"><...
Web 开发
81,092
社区成员
341,716
社区内容
发帖
与我相关
我的任务
Web 开发
Java Web 开发
复制链接
扫一扫
分享
社区描述
Java Web 开发
社区管理员
加入社区
获取链接或二维码
近7日
近30日
至今
加载中
查看更多榜单
社区公告
暂无公告
试试用AI创作助手写篇文章吧
+ 用AI写文章