火狐下input焦点无法重复获取问题的解决方法


Posted in Javascript onJune 16, 2014

今天遇到了一个很棘手的问题,就是在做一些输入框的验证的时候,我这边项目的业务逻辑就是当我选中某个select的某个特定option的时候,需要显示出一个input输入框让用户输入东西,但是如果用户啥也不做,就必须弹出警告框让用户输入,等其输入后,我这边再将input隐藏掉。

因此,便产生了如下问题,input输入框显示的时候,需要自动获取焦点,此时,我是用的

document.getElementById('id').focus();

恩,尝试了一下,效果很好,不禁心中大喜,搞定!

但是天算不如人算,在我进行用火狐测试的时候,完蛋了,第一次刚将input显示出来的时候是好用的,但是随后我关闭alert提醒框的时候,input无法获取焦点了,?澹

问题棘手,又不明其所以,so,小小的查了一下网上大神们的解答方式,发现了如下一招,试验了一下,果然很好用!

在alert之后,将原来的

document.getElementByIdx('id').focus();

换成
window.setTimeout(function () { document.getElementById('id').focus();}, 0);

爽,问题解决!

setTimeout是指在载入后延迟指定时间后执行前面的表达式,当然在这里是延迟0ms之后执行function。

当我只是解决了这个问题,仍然不知道为什么在火狐下这样就能解决,如有哪位大神晓得,给下留言,让晚生学习一下,不胜感激!

Javascript 相关文章推荐
JS获取鼠标坐标的实例方法
Jul 18 Javascript
javascript的propertyIsEnumerable()方法使用介绍
Apr 09 Javascript
js截取中英文字符串、标点符号无乱码示例解读
Apr 17 Javascript
jQuery解析XML文件同时动态增加js文件的方法
Jun 01 Javascript
原生js实现图片轮播特效
Dec 18 Javascript
Bootstrap CSS组件之按钮下拉菜单
Dec 17 Javascript
浅谈JS对html标签的属性的干预以及对CSS样式表属性的干预
Jun 25 Javascript
js实现随机数小游戏
Jun 28 Javascript
借助云开发实现小程序短信验证码的发送
Jan 06 Javascript
JavaScript代理模式原理与用法实例详解
Mar 10 Javascript
JavaScript 中判断变量是否为数字的示例代码
Oct 22 Javascript
vue.js实现点击图标放大离开时缩小的代码
Jan 27 Vue.js
两种方法实现在HTML页面加载完毕后运行某个js
Jun 16 #Javascript
jquery实现在页面加载完毕后获取图片高度或宽度
Jun 16 #Javascript
jQuery实现简单网页遮罩层/弹出层效果兼容IE6、IE7
Jun 16 #Javascript
jquery网页回到顶部效果(图标渐隐,自写)
Jun 16 #Javascript
解决checkbox的attr(checked)一直为undefined问题
Jun 16 #Javascript
Javascript实现简单的富文本编辑器附演示
Jun 16 #Javascript
javascript操纵OGNL标签示例代码
Jun 16 #Javascript
You might like
用PHP产生动态的影像图
2006/10/09 PHP
PHP 字符串 小常识
2009/06/05 PHP
PHP 中文乱码解决办法总结分析
2009/07/30 PHP
PHP根据两点间的经纬度计算距离
2014/10/31 PHP
php编程每天必学之验证码
2016/03/03 PHP
php和asp语法上的区别总结
2019/05/12 PHP
Yii2框架控制器、路由、Url生成操作示例
2019/05/27 PHP
php时间戳转换代码详解
2019/08/04 PHP
PHP tp5中使用原生sql查询代码实例
2020/10/28 PHP
javascript基础第一章 JavaScript与用户端
2010/07/22 Javascript
js中typeof的用法汇总
2013/12/12 Javascript
JS实现支持多选的遍历下拉列表代码
2015/08/20 Javascript
超漂亮的Bootstrap 富文本编辑器summernote
2016/04/05 Javascript
基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用
2016/05/12 Javascript
原生js实现可爱糖果数字时间特效
2016/12/30 Javascript
原生JS 购物车及购物页面的cookie使用方法
2017/08/21 Javascript
angular6.0开发教程之如何安装angular6.0框架
2018/06/29 Javascript
js中async函数结合promise的小案例浅析
2019/04/14 Javascript
Vue指令实现OutClick的示例
2020/11/16 Javascript
k8s node节点重新加入master集群的实现
2021/02/22 Javascript
Python机器学习之决策树算法实例详解
2017/12/06 Python
python3 中文乱码与默认编码格式设定方法
2018/10/31 Python
用uWSGI和Nginx部署Flask项目的方法示例
2019/05/05 Python
Pycharm连接远程服务器过程图解
2020/04/30 Python
Python使用matplotlib绘制圆形代码实例
2020/05/27 Python
Python 爬虫性能相关总结
2020/08/03 Python
容易被忽略的Python内置类型
2020/09/03 Python
pyqt5实现井字棋的示例代码
2020/12/07 Python
什么是跨站脚本攻击
2014/12/11 面试题
比较一下entity bean和session bean
2013/12/27 面试题
入党申请书自我鉴定
2013/10/12 职场文书
女子职高个人自荐书
2014/02/01 职场文书
幼儿园大班区域活动总结
2014/07/09 职场文书
导游欢送词
2015/01/31 职场文书
隐形的翅膀观后感
2015/06/10 职场文书
Python使用OpenCV和K-Means聚类对毕业照进行图像分割
2021/06/11 Python