首页
学习
活动
专区
圈层
工具
发布
    • 综合排序
    • 最热优先
    • 最新优先
    时间不限
  • 来自专栏前端自习课

    【JS】310- 使用 focusout 事件,解决 iOS 键盘收起不归位问题

    而与之相类似的有另外 2 个事件 focusin 和 focusout 则是可以冒泡的。 网上一些文章提到 focusin 和 focusout 是 IE 浏览器才支持的一种 DOM 事件。 所以,果断通过这两个事件解决问题,我们改成 focusout <div @focusout="inputBlur"> <input type="text" placeholder="请填写省市县 这里我们用 setTimeout 来解决: <div @<em>focusout</em>="inputBlur" @focusin="inputFocus"> <input type="text" placeholder

    3.9K10发布于 2019-08-09
  • 来自专栏魔术师卡颂

    focus/focusin/focusout

    速答: focusin与focusout事件会冒泡。 focus与blur事件不会冒泡。 ---- 什么元素能够focus 默认情况并不是所有元素都能获得焦点。 focusin/focusout focus与blur事件不会冒泡。如果想实现事件代理可以通过允许捕获实现。 form.addEventListener("blur", () => form.classList.remove('focused'), true); </script> 如果想在冒泡阶段实现事件代理,可以使用focusin与focusout

    1K20发布于 2020-08-26
  • 来自专栏IMWeb前端团队

    滚动上报实现

    所以采用focusout事件是一个较为不错的选择: let maxCount = 0; let reportedCount; // scroll to change maxCount... $(document.body).on('focusout', () => { if (maxCount > reportedCount) { // 只需上报最大值即可 // report maxCount... } }); focusout事件的兼容性还是不错的,因为此需求只需要在QQ内嵌页中完成,所以并没有考虑到firefox的兼容性,并且它是冒泡的。

    1.1K70发布于 2018-01-08
  • 来自专栏IMWeb前端团队

    滚动上报实现

    所以采用focusout事件是一个较为不错的选择: let maxCount = 0; let reportedCount; // scroll to change maxCount... $(document.body).on('focusout', () => { if (maxCount > reportedCount) { // 只需上报最大值即可 // report maxCount... } }); focusout事件的兼容性还是不错的,因为此需求只需要在QQ内嵌页中完成,所以并没有考虑到firefox的兼容性,并且它是冒泡的。

    82820发布于 2019-12-04
  • 来自专栏柠檬先生

    jquery鼠标事件

    .focusout()   将一个事件函数绑定到失去焦点事件上。   .focusout(handler)     handler       每次事件出发会执行的函数。    .focusout([eventData],handler)     eventData       一个对象,它包含的数据键值对映射将被传递给事件处理程序。      用法:     $("p").focusout(function() {       $(this).find("span").css('display','inline').fadeOut

    6.5K70发布于 2018-01-19
  • 来自专栏JS菌

    梳理下常见的不冒泡事件

    Event Type Notes User shifts focus focusin 第一个目标元素获得焦点之前触发 focus 第一个目标元素获得焦点之后触发 User shifts focus focusout 第一个目标元素失去焦点之前触发 focusin 第二个目标元素获得焦点之前触发 blur 第一个目标元素失去焦点之后触发 focus 第二个元素获得焦点之后触发 •blur 不冒泡 ❌•focus 不冒泡 ❌•focusin•focusout 如果要坚挺具体的焦点变化情况,那么应该使用 focusin 和 focusout Mouse 事件 如果元素内部没有嵌套另一个元素,事件触发的顺序见下表: Event Type Element Notes 不冒泡 ❌•mouseleave 不冒泡 ❌•mousemove•mouseout•mouseover•mouseup mouseenter/mouseleave 看这个单词也是跟 focusin/focusout

    1.6K30发布于 2019-04-23
  • 来自专栏HTML5学堂

    2016.07 第3周 群问题分享

    JavaScript focus/blur与focusin/focusout的区别与联系 2016.07.18~2016.07.22 核心内容 focus/blur与focusin/focusout 问题解析 focus/blur不冒泡,focusin/focusout冒泡 focus/blur兼容性好,focusin/focusout在除FireFox外的浏览器下都保持良好兼容性,如需使用事件委托,可考虑在

    1.1K80发布于 2018-03-13
  • 来自专栏html5期末大作业

    计算机毕业设计:基于HTML学校后台用户登录界面模板源码

    var username = $(this).val(); if(username=='输入学号'){ $(this).val(''); } }); $("#stu_username_hide").focusout var username = $(this).val(); if(username=='输入验证码'){ $(this).val(''); } }); $("#stu_code_hide").focusout username = $(this).val(); if(username=='输入教工号'){ $(this).val(''); } }); $("#tea_username_hide").focusout var username = $(this).val(); if(username=='输入验证码'){ $(this).val(''); } }); $("#tea_code_hide").focusout username = $(this).val(); if(username=='输入教务号'){ $(this).val(''); } }); $("#sec_username_hide").focusout

    3.5K20编辑于 2022-08-18
  • 来自专栏deepcc

    浏览器的visibilitychange 事件ie10以下不兼容

    'focusin focusout' : 'focus blur', d = ['', 'moz', 'ms', 'o', 'webkit'], c = :blur|focusout)$/.test(l) ?

    2.5K60发布于 2018-05-16
  • 来自专栏cnblogs

    DOM事件第二弹(UIEvent事件)

    绑定事件公共类) var fixs = { 'focusin': { standard: 'focus', ie: 'focusin' }, 'focusout 事件名 说明 focus 获得焦点,不冒泡 blur 失去焦点,不冒泡 focusin 获得焦点,冒泡 focusout 失去焦点,冒泡 DOMFocusin 获得焦点,不冒泡,遗留方案 DOMFocusout 失去焦点,不冒泡,遗留方案 3.1 代理事件的兼容处理方案 ie、opera、chrome等都支持focusin和focusout,但firefox不支持focusin和focusout

    3.2K90发布于 2018-01-17
  • 来自专栏腾讯IVWEB团队的专栏

    React 事件初探

    除Firefox浏览器外都可使用支持冒泡的 focusin/focusout 来代替 focus/blur 事件,Firefox会在捕获阶段监听 focus/blur 事件。 根据不同的浏览器对onmouseover事件、onscroll事件以及focusin、focusout事件的支持情况的不同,react进行了有针对性的处理,以下为react事件系统跨浏览器执行的部分代码实现 blur', mountAt); } else if (isEventSupported('focusin')) { // IE 浏览器支持的focusin和focusout ); ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(topLevelTypes.topBlur, 'focusout

    2.2K00发布于 2017-05-02
  • 来自专栏IMWeb前端团队

    React事件初探

    除Firefox浏览器外都可使用支持冒泡的 focusin/focusout 来代替 focus/blur 事件,Firefox会在捕获阶段监听 focus/blur 事件。 根据不同的浏览器对onmouseover事件、onscroll事件以及focusin、focusout事件的支持情况的不同,react进行了有针对性的处理,以下为react事件系统跨浏览器执行的部分代码实现 blur', mountAt); } else if (isEventSupported('focusin')) { // IE 浏览器支持的focusin和focusout ); ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(topLevelTypes.topBlur, 'focusout

    1.1K10发布于 2019-12-04
  • 来自专栏IMWeb前端团队

    React事件初探

    除Firefox浏览器外都可使用支持冒泡的 focusin/focusout 来代替 focus/blur 事件,Firefox会在捕获阶段监听 focus/blur 事件。 根据不同的浏览器对onmouseover事件、onscroll事件以及focusin、focusout事件的支持情况的不同,react进行了有针对性的处理,以下为react事件系统跨浏览器执行的部分代码实现 blur', mountAt); } else if (isEventSupported('focusin')) { // IE 浏览器支持的focusin和focusout ); ReactBrowserEventEmitter.ReactEventListener.trapBubbledEvent(topLevelTypes.topBlur, 'focusout

    1.4K80发布于 2017-12-29
  • 来自专栏对角另一面

    读Zepto源码之Event模块

    除了 focus 事件和 blur 事件外,现代浏览器还支持 focusin 事件和 focusout 事件,他们和 focus 事件及 blur 事件的最主要区别是支持事件冒泡。 因此可以用 focusin 和模拟 focus 事件的冒泡行为,用 focusout 事件来模拟 blur 事件的冒泡行为。 focusout' 可以看到,在此浏览器中,事件的执行顺序应该是 focus > focusin > blur > focusout 关于这几个事件更详细的描述,可以查看:《说说focus /focusin /focusout /blur 事件》 关于事件的执行顺序,我测试的结果与文章所说的有点不太一样。 由于 focusin/focusout 事件浏览器支持程度还不是很好,因此要对浏览器支持做一个检测,如果浏览器支持,则返回,否则,返回原事件名。

    1.8K00发布于 2017-12-27
  • 来自专栏老雷PHP全栈开发

    jQuery基础教程之事件监听操作

    touchend 触摸结束 键盘事件 keydown 键盘按下 keyup 键盘放开 表单事件 submit 表单提交 change 内容改变 focusin 当元素获得焦点时 focusout "#text",function(event){ console.log(event.type) }) $(document).on("focusin focusout

    1.2K10发布于 2020-07-02
  • 来自专栏全栈程序员必看

    ipad上100vh和100%踩坑记「建议收藏」

    最近遇到了一个小bug,在ipad上编辑word文件的虚拟键盘收回时,会导致页面的导航条隐藏,且页面的下面会出现一块空白 自己尝试的解决方案 通过focusin和focusout对虚拟键盘的弹入弹出进行监听 我的理解是:focusin和focusout比较适合于监听对于文本输入框的键盘事件。 通过比较screen.availHeight和screen.height进行比较。

    1.6K10编辑于 2022-08-31
  • 来自专栏菩提树下的杨过

    用Flex模拟智能手机表单输入的自动放大功能

    y="10" text="UserName"/> <s:TextInput x="96" y="30" id="txtName" focusIn="focusInHandler(event)" focusOut > <s:TextInput x="96" y="85" id="txtPwd" displayAsPassword="true" focusIn="focusInHandler(event)" focusOut

    1.1K60发布于 2018-01-22
  • 来自专栏国标视频云平台

    SkeVSS国标视频汇聚云服务使用Onvif、GB28181协议对监控ye摄像机设备进行PTZ云台控制

    @apiParam {Number} channel 指定通道号 * @apiParam {String=stop,up,down,left,right,zoomin,zoomout,focusin,focusout C.SKEYE_PTZ_CMD_TYPE_ZOOMOUT) case "focusin": _cmd = uintptr(C.SKEYE_PTZ_CMD_TYPE_FOCUSIN) case "focusout ": _cmd = uintptr(C.SKEYE_PTZ_CMD_TYPE_FOCUSOUT) case "aperturein": _cmd = uintptr(C.SKEYE_PTZ_CMD_TYPE_APERTUREIN

    1.3K30编辑于 2023-04-10
  • 来自专栏站长的编程笔记

    【说站】js中有哪些焦点事件

    4、focusout是HTML事件blur的通用版本。

    7.6K30编辑于 2022-11-24
  • 来自专栏web前端-

    JQ事件和事件对象

    11 </script> 三 表单事件  1  focus ()  :获得焦点事件     2  blur(): 失去焦点事件     3 focusin()  :获得焦点事件     4 focusout text或者多行文本areatext时,触发事件    7 submit()  :表单提交事件  //focus()和focusin() 的区别   focusin可以在父元素上检测子元素获得焦点的情况 而focusout

    5.4K20发布于 2018-09-13
领券