在HTML的<img>标签使用onblur事件

最新推荐文章于 2023-11-29 14:39:35 发布
最新推荐文章于 2023-11-29 14:39:35 发布
阅读量6.7k 收藏 1
点赞数
分类专栏： HTML + CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/foart/article/details/17789343
版权

由于<img>标签可用的事件并没有onblur，这时只要添加 tabIndex=数字 之后就可以使用onblur事件了。

 

下面这代码是使用my97日历控件，当点击图片后打开。失去焦点时隐藏。

 

<input id="ab_HappenTime" name="ab_HappenTime" type="text" class="easyui-validatebox" required="true" missingMessage="必填项" style="width: 200px;"  οnblur="time_onblur()"/></input>			         
			            				              	
			              	<img οnclick="WdatePicker({el:'ab_HappenTime',dateFmt:'yyyy-MM-dd HH:mm:ss',errDealMode:2})" src="${basePath}/res/m97/skin/datePicker.gif" width="16" height="22" align="absmiddle" tabIndex=1 οnblur="javascript:$dp.hide();">


 

cg_program
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
imgblurin实现图片模糊加载的效果
08-10
img-blur-in：实现图片模糊加载的效果。将渐变效果和图片加载相结合
HTML a 标签.docx
12-08
* 使用图像作为链接：<a href="http://www.w3school.com.cn"><img src="w3school_logo.gif" alt="W3School"></a> * 链接到同一个页面的不同位置：<a href="#top">返回顶部</a> * 在新的浏览器窗口打开链接：<a href=...
关于html中的onBlur事件和focus事件
互联网
12-07 509
定义和用法 onblur 事件会在对象失去焦点时发生。 就是一个事件,在控件获得失去焦点时是触发, 比如有一个文本输入框&lt;input type="text"&gt;,你想在用户点击它输入文本时,执行改变它的外观或者其它什么操作,就可以定义完成这个操作的处理程序,并&lt;input type="text" onblur="SomeSub"&gt; onFocus事...
blur属性html,html中的onfocus和onblur是什么属性？怎么使用？
weixin_30341121的博客
06-05 1217
html中的onfocus和onblur是什么属性？怎么使用？本篇文章就给大家介绍onfocus属性和onblur属性是什么，让大家了解onfocus属性和onblur属性的简单用法。有一定的参考价值，有需要的朋友可以参考一下，希望对你们有所帮助。首先我们要知道onfocus和onblur都是html的事件属性，接下来简单介绍一下这两个属性。1、onfocus事件属性onfocus 属性在元素获得...
HTML DOM blur() 方法
weixin_30487317的博客
06-25 58
定义和用法 blur() 方法用于从链接上移开焦点。 语法 anchorObject.blur() 实例 1<html> 2<head> 3<styletype="text/css"> 4a:active{color:green} 5</style> 6 7<scripttype="text...
onblur在html中的作用
移动互联网后端服务架构
10-31 2413
eg： onblur在html中的作用：当控件在失去聚焦时发生 标题 function check() {     var password1 = document.all.password.value;         var password2 = document.all.repassword.value;     if(password1 != passw
HTML期末复习题含答案.pdf
02-28
11. 在IMG标签中，align属性用于控制图像在文本中的对齐方式，而valign属性用于控制图像的垂直对齐，但这些属性在HTML5中已不再推荐使用，建议使用CSS来替代。 12. 事件处理中，onMouseOver事件发生在鼠标移到元素...
Javascript事件的定义.doc
01-11
这些属性可以直接写在HTML标签中，实现内联事件处理，也可以通过JavaScript代码动态绑定。 ```html <input type="text" onblur="handleBlur()" /> ``` 三、事件监听器： 现代JavaScript更推荐使用addEventListener...
Web前端开发初级实操考试评分细则
07-01
`<img>`标签用于插入图像，`p`标签代表段落。`border-radius`用于设置元素边框的圆角，`15px`表示圆角半径。`text-align`属性用于设置文本的对齐方式，`center`居中对齐。`transition`属性定义元素从一种样式变换到...
javaee英语单词文档整理.pdf
11-19
列表（list）分为有序列表（ordered list）和无序列表（unordered list），分别使用`<ol>`和`<ul>`标签，列表项则由`<li>`标签定义。类型（type）可以用来设定列表的样式。间距（spacing）如字距（spacing）和行距等...
img标签的onerror事件
偏执
07-19 1567
同时我们想去除载入图片失败时显示在左上角的碎片图标，这个要借用img标签的onerror事件和javascript，img标签支持onerror 事件，在装载文档或图像的过程中如果发生了错误，就会触发onerror事件。但问题来了，如果logoError.png 也不存在，则继续触发 onerror，导致循环，故会出现打开网页时提示 Stack overflow at line: 0错误。当图片不存在时，将触发 onerror，而 onerror 中又为 img 指定一个logoError.png 图片。
img标签加载失败方法(onerror)、加载成功(onload)的方法、readystatechange事件、complete属性
热门推荐
yiyueqinghui的博客
05-20 1万+
1、error事件（img标签加载失败的方法） < img src=“123” :οnerrοr=“defaultImg()” /> function defaultImg(){ //地址错误时，直接删除img标签 this.remove() } 或者 function defaultImg(event){ //地址错误时，设置默认图片 let img = event.srcElement; img.src = ‘默认图片地址’; img.onerror
img 标签使用 @error 事件的时候 图片一直闪烁的问题
最新发布
m0_61840359的博客
11-29 687
通过showErrorImg 来判断当前图片是否已经是图片出错处理之后的如果是就证明item.vendorpicfile的图片也出错了所以我们就可以使用默认图片，这样就不会出错啦。上面这段代码一旦otherPic 有并且出错的话就会出现死循环的情况。出现闪烁的原因可能是出现 死循环了。
HTML语言中 blur()方法,HTML DOM blur() 方法
weixin_31956641的博客
05-31 2645
HTML DOM blur() 方法blur() 方法用于从链接上移开焦点。blur() 方法可把键盘焦点从顶层浏览器窗口移走，整个窗口由 Window 对象指定。哪个窗口最终获得键盘焦点并没有指定。浏览器支持注释：在某些浏览器上，该方法可能无效。支持的浏览器：下面列出了blur()方法支持的浏览器：谷歌浏览器IE浏览器火狐浏览器Opera苹果浏览器DOM模糊方法用于从当前元素中移除键盘焦点，并在...
悬浮点击事件
H_e_a_l_e_r的博客
11-30 894
使用Jquery完成点击悬浮事件 (￣y▽￣)╭ Ohohoho.....
img的hover事件闪动
10-10 768
今天给同学写一个相册照片鼠标浮动显示细节的效果，遇到了闪动的bug，也顺利解决，就写下来跟大家分享。 我使用的是‘标签：hover + 标签’的形式，如果使用jquery的mouseover、mouseout等事件，也可以参考此方法，原理一样。 分析：图片使用,然后使用div+span写入鼠标浮动要显示的文字和背景。如下代码：（会出现闪动） html代码： 1 <img...
html设置焦点图片,HTML设置焦点
weixin_39901203的博客
06-04 743
**插件简介**这是一款很有特点的HTML5图片切换焦点图动画，点击左右按钮即可将图片进行弹性切换，图片在被切换时，都会左右晃动几下，产生一定的弹性缓冲动画效果。[contenteditable]:focus{outline:none;}如果input失去焦点时,有进行内容check,当内容不符合时,焦点回退.此时,input到input与input到select的顺序不一致.第一步：为了更好的...
css字体单位、背景、光标悬停离开事件、替换img路径
qq_40237472的博客
07-05 279
字体单位： 然而在CSS中，W3C文档把尺寸单位划为为两类：相对长度单位和绝对长度单位。然而相对长度单位按照不同的参考元素，又可以分为字体相对单位和视窗相对单位。字体相对单位有：em、ex、ch、rem；视窗相对单位则包含：vw、vh、vmin、vmax几种。绝对定位则是固定尺寸，它们采用的是物理度量单位：cm、mm、in、px、pt以及pc。但在实际应用中，我们使用最广泛的则是em、rem、p...
js:页面多处输入只使用一个验证码/获得焦点显示/onblur隐藏实现
我的笔记
04-09 826
/* * 全页共用验证码 CHRD.verify({id:'id', blurFunc, focusFunc, clickFunc, src}),0参数换码,没参数隐藏 */CHRD.verify = function(obj) {        var img = CHRD.getObj('publicVerifyImg');    var change = function() {//刷新图片
<!DOCTYPE html> <html> <head> <title>表格形式</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> table, th, td { border: 1px solid black; border-collapse: collapse; padding: 5px; } </style> <script> // 添加一行 function addRow(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); for(var i = 0; i < 5; i++){ var cell = row.insertCell(i); cell.innerHTML = '<select><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select>'; cell.onclick = function(){ this.firstChild.style.display = 'block'; } cell.firstChild.onblur = function(){ this.style.display = 'none'; } cell.firstChild.style.display = 'none'; } } </script> </head> <body> <table id="myTable"> <thead> <tr> <th>列1</th> <th>列2</th> <th>列3</th> <th>列4</th> <th>列5</th> </tr> </thead> <tbody> <tr> <td><select><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select></td> <td><select><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select></td> <td><select><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select></td> <td><select><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select></td> <td><select><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select></td> </tr> </tbody> </table> <button onclick="addRow('myTable')">增加</button> </body> </html>将这段代码用bootstrap进行优化
04-23
cell.innerHTML = '<select class="form-control"><option value="1">选项1</option><option value="2">选项2</option><option value="3">选项3</option></select>'; cell.onclick = function(){ this.firstChild...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值