焦点事件

最新推荐文章于 2022-05-17 17:09:29 发布
最新推荐文章于 2022-05-17 17:09:29 发布
阅读量213 收藏
点赞数 1
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_44211323/article/details/87982418
版权

（作者：郭鑫 撰写时间：2019年2月5号）
要触发一段代码，就要用事件进行处理，这次我想要分享的是点击事件与焦点事件
onfocus事件是指当焦点在某元件上时触发的事件，触发次数不限，如果焦点一直在该元件上，使一直触发onfocus事件，直到该元件失去焦点为止。
代码部分
html部分：在这里插入图片描述
JS代码：
在这里插入图片描述
这里把事件绑定在了input标签上，当点击input时文字会隐藏，如果再点击input标签则无变化，当点击除了input标签以外的元素文字就会隐藏起来
（点击input标签前）
在这里插入图片描述
（点击input标签后）
在这里插入图片描述
(点击除了input标签以外的元素后)
在这里插入图片描述

X爪哇程序猿
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
什么是焦点事件？
weixin_33756418的博客
09-23 266
焦点事件： 比如打开一个应用程序，里面有一个文本框，当你用鼠标点击这个文本框的时候，这个文本框就是获得了焦点，你会发现文本框里会有光标闪动，这是你可以对文本框进行操作，输入字符串什么的，  也就是触发了keypress事件，当然并不一定是用鼠标点击文本框，使用tab键可以将焦点转移。  文本焦点事件： onBlur:当失去输入焦点后产生该事件 onFocus:当输入获得焦点后，产...
随笔-ivew使用vue自定义指令on-focus无效
XuMiao_的博客
03-11 1757
随笔-ivew使用vue自定义指令on-focus无效 看视频学习vue,搭建一个ivew-vue项目 在学习自定义指令的时候发现按照官网的自定义指令并不生效,让input框页面加载自动聚焦 代码如下: <i-input search enter-button="Search" @on-search="search(searchCondition)" v-model="searchCond...
input框激活时展示div，失去焦点时隐藏
菲律宾铁猴子的博客
05-17 1037
Vue输入框的on-focus与on-blur事件 on-focus：输入框聚焦时触发 on-blur:输入框失去焦点时触发 v-show:切换元素的显示状态，true为显示，false为隐藏 根据文章需求，我们应该在input框中绑定上述的on-focus和on-blur，设置需要被控制的div的v-show，控制显示与隐藏，具体代码如下： input框 <Input @on-focus="showDictory" @on-blur="hideDictory" /> 方法 showDicto
JS---焦点事件onfocus和onblur造成的死循环问题
tiaochewang219的博客
12-06 1519
alert和onblur死循环 点击文本框触发聚焦事件，弹出警告框，然后点击警告框中中的确定，其实焦点已经移动到警告框，触发失焦事件了，确定后焦点又会回到文本框，又会触发聚焦事件，形成循环。因此alert（）不应该与焦点事件一起使用。 &lt;script type="text/javascript"&gt; window.onload=function(){ var text1=docume...
vue自定义指令on-focus无效
hlvy
07-17 3036
// 注册一个全局自定义指令 `v-focus` Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() } }) 然后你可以在模板中任何元素上使用新的 v-focus 属性，如下： <input v-focus> 经过...
Android OnFocuChangeListener焦点事件详解
08-29
Android OnFocuChangeListener 焦点事件详解 Android OnFocuChangeListener 焦点事件是 Android 开发中一个重要的事件监听器，它可以监控 EditText 的焦点变化，提供了焦点变化时的回调函数，从而可以进行相应的...
jquery获取焦点和失去焦点事件代码
01-21
我们在做网站的时候经常会用到搜索框的获得焦点和失去焦点的事件，因为懒，每次都去写非常的烦，于是就一劳永逸，遇到类似情况就来调用一下就OK 了 相关js代码: 代码如下: <html xmlns=”...
解决Js先触发失去焦点事件再执行点击事件的问题
10-18
今天小编就为大家分享一篇解决Js先触发失去焦点事件再执行点击事件的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
div失去焦点事件实现思路
09-04
"div失去焦点事件实现思路"这个话题主要探讨了如何在非表单元素，如`span`, `div`, `li`等上模拟焦点和失去焦点的事件，因为传统的`blur`事件只适用于表单元素。下面将详细解释相关知识点。 首先，`blur`事件是...
Android 焦点事件
01-02
在Android系统中，焦点事件是用户交互的重要组成部分，它涉及到用户与界面元素的互动，如按钮、输入框等。理解并正确处理焦点事件对于构建高效、流畅的用户体验至关重要。本文将深入探讨Android焦点事件的概念、机制...
vue里的指令
qq_37635012的博客
04-29 219
今天我们学习一下vue里经常用到的各种指令。 v-html指令与v-bind指令 文本插值{{ }}将代码原样展示，v-html指令将html代码解析之后展示。看下例： data里变量的定义: 最后浏览器效果如下: 上边的两个跳转链接都能点击后跳到对应的地址，v-bind指令可以缩写为:，也就是说这里可以缩写为< a :href=“website” target="_blank"&gt...
onAttachedToWindow()与onWindowFocusChanged()使用
qq_34900897的博客
12-29 2347
在学习recyclerview的时候看到onWindowFocusChanged()的方法，平时没有怎么用，然后百度一下看看怎么用，结果看到onAttachedToWindow()方法，又继续查阅看了一些源码，对于我这种小白来说，看源码还是有点头晕的，为了以防忘记，还是记录一下： 先看onAttachedToWindow()； 看了一下：http://blog.csdn.net/guxiao1
iview弹出对话框的input框和table中input框每次都自动聚焦focus
sunny_day的博客
06-26 1万+
1.在html里面设置autofocus属性。但不难发现只会触发一次，每次在运行起来的时候就执行了获得焦点，之后点击就无效了。2.在html里面设置v-focus使用官方例子：directives: { focus: { // 指令的定义 inserted: function (el) { el.focus() ...
Vue的@focus和@change
鲨鱼辣椒灬的博客
05-30 2万+
@focus:一般是更新下拉框,每次打开会请求后端方法 @change:就是你要联动的方法 作者：ll594317566 来源：CSDN
悬浮框实现
a1317338022的博客
12-20 969
项目 项目1 项目2 项目3 计划任务 完成任务 创建一个表格 一个简单的表格是这么创建的： 项目 Value 电脑 $1600 手机 $12 导管 $1 设定内容居中、居左、居右 使用:---------:居中 使用:----------居左 使用----------:居右 第一列 第二列 第三列 第一列文本居中 第二列文本居右 第三列文本居左 SmartyPants SmartyPants将A...
事件之事件类型-焦点事件（FocusEvent）
xiaoyangzhu的博客
12-17 4105
焦点事件一览表 属性/方法 定义 blur 当元素失去焦点时触发。这个事件不冒泡，所有浏览器都支持 DOMFocusIn 当元素获得焦点时触发。这个事件是 focus 的冒泡版。Opera 是唯一支持这个事 件的主流浏览器。DOM3 Events 废弃了 DOMFocusIn，推荐 focusin DOMFocusOut 当元素失去焦点时触发。这个事件是 blur 的通用版。Opera 是唯一支持这个事 件的主流浏览器。DOM3 Events 废弃了 DOMFocusO
下拉框的触发事件分析（onchange、onfocus、onclick）
zhanghuan0303的博客
04-23 1万+
select的onChange事件问题解决（onchange、onfocus、onclick、onmousedown） 一、onChange事件只有在值改变时才可触发，所以必须在每一次选择时（尤其第一次）保证选择的值是改变的！ 所以 selected>个人//在这要选定一个默认的值 “selected” 单位 这样在选择第二个时，值就会变即可触发onChang
获得焦点与失去焦点事件
热门推荐
实践求真知
04-12 3万+
一 介绍 获得焦点事件（onfocus）是当某个元素获得焦点时触发事件处理程序。 失去焦点事件（onblur）是当前元素失去焦点时触发事件处理程序。 一般情况下，这两个事件是同时使用的。   二 应用 文本框获得焦点时改变背景颜色 本示例是在用户选择页面中的文本框时，改变文本框的背景颜色，当选择其他文本框时，将失去焦点的文本框背景颜色恢复原始状态。   三 代码
一步一步学android之事件篇——焦点事件
Kay的专栏
08-28 6391
焦点事件其实就是当我们操作那个组件时获取的事件，比如发短信，在我们点击输入框输入内容的时候就获取了焦点，今天的例子也是用EditText来完成的，下面来看看焦点事件OnFocusChangeListener的使用，效果如下： 大概的效果就是：当第一个EditText获取焦点时，自动添加文字，当第二个EditText获取焦点时，先判断第一个EditText中的内容是否含有屏蔽字符串（自动）
PasswordBox焦点事件
最新发布
07-08
在WPF（Windows Presentation Foundation）中，可以使用以下方式为PasswordBox添加焦点事件的处理程序： 首先，在XAML中添加PasswordBox控件，并为其指定一个名称和一个焦点事件处理程序： ```xaml ``` 然后，在...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值