如何让焦点始终固定在特定⽂本框
没耐⼼的朋友,可以直接看代码。
最近在做⼀个关于收银台的项⽬,其中有⼀个需求,是扫码扫描⽀付码进⾏⽀付。扫码触发的事件,其实是⼀个keyup enter事件,要捕获到这个事件,必须将焦点定在⽀付码输⼊框内才可以。
ElementById('focusInput');
inputEle.focus();
inputEle.focus();
};
⼀开始的时候,定义焦点在⽂本框,当⽂本框失去焦点的时候重新定焦在⽂本框。很简单的⽅法,就实现了固定焦点的要求。
后来这个页⾯上⼜多了搜索框和商品列表,那么,当焦点在其他⽂本框的时候,如何判断使其能正常输
⼊呢?
起初,我还是按上⾯⽅法去做,却发现,⿏标⽆论如何点击,document.activeElement(当前焦点坐在元素)始终是body元素。这样,就⽆法判断,焦点是否在⽂本框。于是我想到了⽤定时器来做,代码如下:
var focus=function(){
setTimeout(function(){
let activeElement=document.activeElement;
pe!=='text'){
input绑定onblur事件inputEle.focus();
}
focus();
},60);
}
focus();
定时器每隔60ms检查⼀次,当发现焦点不在⽂本框⾥,则定焦到最初的⽂本框,否则不改变焦点。
⽤上⾯两种⽅法,基本上就可以满⾜所有固定焦点的情况了。
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论