项目场景:
我这里只需要点击后就可以使用键盘输入文字。
操作流程:点击某个地方(触发方法),显示输入框,同时获取鼠标焦点。
问题描述:
点击显示输入框,可直接输入,自动获取鼠标焦点。
原因分析:
提示:这里填写问题的分析:
例如:Handler 发送消息有两种方式,分别是 Handler.obtainMessage()和 Handler.sendMessage(),其中 obtainMessage 方式当数据量过大时,由于 MessageQuene 大小也有限,所以当 message 处理不及时时,会造成先传的数据被覆盖,进而导致数据丢失。
解决方案1:
我在搜索资料时,遇到过两种方案。
第一种方案,直接在输入框上加上如下部分代码:autofocus=“autofocus”
<textarea name="textArea" id="textArea" class="text-style" placeholder="Press Enter button to finish."
v-model="inputValue" v-if="showText" @keydown="keyDown($event)" autofocus="autofocus"></textarea>
第一种较为简单,只能是第一次点击才行。
我的使用场景:输入框默认是隐藏的,点击后显示了输入框,输入完毕,按下enter键隐藏了输入框,再次点击会显示输入框,但不会获取焦点。所以使用方案2
解决方案2:
不会出现上面问题,但是要设置延时时间。
原因:focus必须延时一段时间才能生效。所以,加上延时函数进行延时处理。
第二种方案:
getFocus(){
if (this.showText === true){
setTimeout(() => {
try {
document.getElementById("textArea").focus();
} catch (e) { }
}, 200); // 设置延时0.2秒
}
},