怎样治疗<a>标签不能触发onblur事件

Chrome元素聚焦问题解决
最新推荐文章于 2024-05-31 13:53:36 发布
最新推荐文章于 2024-05-31 13:53:36 发布
阅读量657 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： python 数据库 前端 ViewUI
原文链接：https://my.oschina.net/weijuer/blog/1929671
本文介绍了一个关于Chrome浏览器中元素无法获得焦点的问题及其解决方案。通过设置tabindex属性为0，可以使包括body和锚点等在内的不可聚焦元素变为可聚焦，从而激活blurevent事件。

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

I realize this was over a year ago, but it showed up for me in Google while trying to solve this same issue.

It seems Chrome does not consider some elements, like body and anchors, to be "focusable". According to the following page, you can make any element focusable (thereby activating the blur event) by setting the tabindex attribute: http://www.quirksmode.org/dom/events/blurfocus.html

Like so:

<a href="#" tabindex="0" onblur="alert('blur')"> blur me </a>

 

转载于:https://my.oschina.net/weijuer/blog/1929671

关注
21、HTML中＜select＞元素的使用详解
sss66的博客
06-11 33
本文详细介绍了HTML中<select>元素的使用，包括创建下拉列表和列表框的基础知识、添加与移除选项的方法、事件处理及实际应用示例。通过JavaScript操作Select对象及其Option对象属性，可以实现灵活的交互功能，如动态修改选项、计算日期差等。文章还探讨了<select>元素在不同场景下的拓展应用和优化建议，帮助开发者提升表单设计的用户体验与开发效率。
div失去焦点事件onblur()不触发解决方法
weixin_46787337的博客
11-02 4128
做一个弹出框组件，文字点击时会在文字下方弹出一个框，在vue3中监听div元素的blur事件发现事件并不会在div失去焦点时触发。bug原因：在vue中div默认不触发事件,除非将元素添加。在react中div元素是能触发onblur事件的。属性才会触发blur事件。
blur事件
weixin_34082789的博客
06-17 168
    &lt;script type="text/javascript"&gt;         $(function () {             $("input:text").blur(function () {//失去焦点时                 if ($(this).val().length &gt; 0)                     $(this)...
div绑定onBlur事件无效的解决方法
sunzhen15896的博客
05-31 361
该场景适用于 点击页面空白区域关闭div的情况。给div绑定onBlur事件，默认不触发。
on-blur事件触发，导致on-click事件没有触发
m0_48636561的博客
04-08 612
事件绑定，onblur和onclick冲突导致onclick不生效
onblur属性详解
热门推荐
qq_39429962的博客
10-09 1万+
onblur 事件会在对象失去焦点时发生，所谓焦点指的就是当前操作的对象，当我们操作一个div时，这个div就获取了焦点，那么onblur的作用是什么呢，在我们需要实现类似点击其他部分取消当前下拉框显示的功能时，onblur属性就要开始显现作用了。 下面是一个实例： &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt...
html的DOM中Event对象onblur事件用法实例
09-03
`onblur`事件可以应用于大多数与用户交互的HTML元素，包括但不限于`<input>`、`<textarea>`、`<select>`等表单元素，以及`<a>`、`<button>`、`<div>`等非表单元素。它在表单验证、数据处理和用户体验优化等方面有着...
function clear(){ document.getElementById('usernameInput').value = ''; document.getElementById('usernameMsg').innerText = ''; document.getElementById('userPwdInput').value = ''; document.getElementById('passwordMsg').innerText = ''; document.getElementById('userRePwdInput').value = ''; document.getElementById('rePasswordMsg').innerText = ''; } </script> </head> <body> <h1 class="ht">欢迎使用日程管理系统</h1> <h3 class="ht">请注册</h3> <form method="post" action="/user/regist" onsubmit="return checkForm()"> <!-----------------------------------------------------------------------> <div class="div0" style="border:1px solid black ; width:300px; height:300px" > 输入账号：<input type="text" name="account"class="ipt" id="usernameInput"onblur="checkUsername()"> <br> <span id="usernameMsg"></span> <br> 输入密码：<input type="password" name="userPwd"class="ipt"id="userPwdInput"onblur="checkPassword()"> <br> <span id="passwordMsg"></span> <br> 确认密码：<input type="password" name="userPwd"class="ipt"id="userRePwdInput"onblur="checkRePassword()"> <br> <span id="rePasswordMsg"></span> </div> <!-----------------------------------------------------------------------> <div class="div1" style="border:0px solid white; width:250px; height:80px" > <button type="submit" class="btn">注册</button> <button onclick="clear()" class="btn">重置</button> <a href="日程管理demo-第一期-登录页.html" class="reg">去登陆</a> </div> 重置没反应
最新发布
06-23
DOCTYPEhtml><html><head><title>重置示例</title></head><body><inputtype="text"id="usernameInput"><spanid="usernameMsg"></span><inputtype="password"id="userPwdInput"><spanid="passwordMsg"></span><input...
JavaScript教程带你快速入门
OIqng的博客
09-03 2737
JavaScript 简介 JavaScript（简称“JS”） 是一种具有函数优先的轻量级，解释型或即时编译型的高级编程语言。 JavaScript 是基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。 JavaScript 用法 HTML 中的脚本必须位于 标签之间。 脚本可被放置在 HTML 页面的 和 部分中。 <script>标签 <script> 和 </script> 会告诉 JavaScript 在何处开始和结
JavaScript——onblur事件失效问题解决方案
无限迭代中......
10-08 6542
基本概念 问题分析 改了写法，把事件写在函数里，然后直接调用，发现一直提示函数未定义，这个和浏览器渲染页面过程有关，就是当浏览器渲染到该标签时，事件函数还没定义，就报错。 解决方案 添加监听事件即可 input.addEventListener('blur',function(){我是一个函数啦啦啦！}); 如果要兼容ie8要用attachEvent 参考文章 http...
onblur事件和onfocus事件失效
学习笔记，不喜勿喷！！勿喷！！
11-17 2709
先看onblur事件和onfocus事件的定义： <element onblur="SomeJavaScriptCode"> <element onfocus="SomeJavaScriptCode"> 双引号中的内容是一段js代码，也可以是一个事件函数 在看几个例子： <!DOCTYPE html> <html> ...
在HTML的<img>标签使用onblur事件
foart的专栏
01-03 6852
由于标签可用的事件并没有onblur，这时只要添加 tabIndex=数字 之后就可以使用onblur事件了。   下面这代码是使用my97日历控件，当点击图片后打开。失去焦点时隐藏。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值