失焦事件触发_js中表单的聚焦失焦事件

焦点事件：

不是所有元素都有焦点事件，只有可交互性的元素才有，比如表单元素，a标签。页面中只能有一个元素有焦点，一个聚焦，另一个就失焦，默认在document。

例子结构如下：

js操作如下：

1.form.txt1.focus(); // 让元素获得焦点，该方法不会触发onfocus()事件。

2.form.txt1.οnfοcus=function(){console.log(1);} //元素获得焦点时会触发该事件

3.form.txt1.οnblur=function(){console.log(2);}　　//元素失去焦点时触发该事件

4.form.btn.οnclick=function(){form.txt1.select();} //选中输入框中的所有文字

5.form.btn.οnclick=function(){ form.txt1.setSelectionRange(2,5) ; form.txt1.focus(); }/ / setSelectionRange需要配合着focus()使用才看得到效果，其中setSelectionRange的结束位置不包含在内，setSelectionRange(start，end)包含两个参数，一个是start：起始位置；一个是end：结束位置。

默认情况下，输入框中的文字被选中的文字颜色是蓝色，如果想要改变背景颜色，可以使用 #txt::selection{background: pink;}来改变

失焦事件触发_js中表单的聚焦失焦事件相关推荐

事件触发控制_前端性能优化：事件的节流throttle与防抖debounce
scroll 事件是一个非常容易被反复触发的事件,另外,resize 事件.鼠标事件(比如 mousemove.mouseover 等).键盘事件(keyup.keydown 等)都存在被频繁触发的风 ...
HTML 中表单form 的相关知识
在Javascript 中,页面上的每一对<form> 标记都解析为一个对象,即form 对象. 可以通过document.forms 获取以源顺序排列的文档中所有form 对象的集合. ...
带你根据源码了解View的事件触发流程，主要讲解为什么子View返回true，ViewGroup就无法接收到事件的过程
转载请标明出处!http://blog.csdn.net/sahadev_/article/details/23839039 ,当然一般也没人转载... 一直想彻底了解View的事件分发过程,在网上也 ...
事件触发控制 Event-Trigger Control Matlab Code
提示:仅供参考事件触发控制Matlab Code 前言一.线性系统二.有限差分法三. Matlab ODE45 总结前言自动控制的大部分工作和研究考虑了周期或时间触发控制系统,在这些系统中 ...
对事件触发（EventHandler）的简单理解
当某个对象的某个事件或者是执行过程发生了,这个对象可以通过事件通知另外一个对象,另外一个对象可以通过传递进来的参数进行相应的处理: 网上有很多关于事件触发的例子,借鉴其中的一个例子对事件触发做如下理解 ...
js进阶 12-5 jquery中表单事件如何使用
js进阶 12-5 jquery中表单事件如何使用一.总结一句话总结:表单事件如何使用:可元素添加事件监听,然后监听元素,和javase里面一样. 1.表单获取焦点和失去焦点事件有哪两组? 注意是 ...
多个输入框失焦事件触发异常问题解决
项目场景: 表单校验,包含多个输入框,需要对每个输入框进行失焦校验,校验不通过需要进行弹框提示用户. 问题描述点击A输入框->再点击B输入框->触发A失焦弹窗->点击弹窗确认-&g ...
js按钮触发网页提醒_js触发asp.net的Button的Onclick事件应用
在asp.net引入事件驱动之后,在一个页面上很容易解决多个按钮触发不同事件的问题,避免了在asp中需要多个form或者通过js脚本来控制的麻烦. asp.net带来便利的同时,也带来一个问题.在实际 ...
java textvaluechanged 全选删除不触发_js动态改变input的值不触发input的change事件的解决办法...
看了网上的资料也比较杂,自己也做一个整理共享一下解决方案 1.原生js的改变之后手动添加监听 1 2 3 var ttt = document.getElementById("ttt&quo ...

失焦事件触发_js中表单的聚焦失焦事件

失焦事件触发_js中表单的聚焦失焦事件相关推荐

最新文章

热门文章