ie focus bug 解决方法
作者:bea
如果把input.focus()放在一个setTimeout中延时执行,则就可以获得焦点。 代码如下: <script type="text/javascript" > (function(){ function get(id){ return document.getElementById(id); } window.onload = function(){ get('makeinput').onmousedown = function(){ v
如果把input.focus()放在一个setTimeout中延时执行,则就可以获得焦点。
代码如下:
<script type="text/javascript" >
(function(){
function get(id){
return document.getElementById(id);
}
window.onload = function(){
get('makeinput').onmousedown = function(){
var input = document.createElement('input');
input.setAttribute('type', 'text');
input.setAttribute('value', 'test1');
get('inpwrapper').appendChild(input);
input.focus();
input.select();
}
get('makeinput2').onmousedown = function(){
var input = document.createElement('input');
input.setAttribute('type', 'text');
input.setAttribute('value', 'test1');
get('inpwrapper2').appendChild(input);
setTimeout(function(){
input.focus();
input.select();
}, 0);
}
get('input').onkeypress = function(){
get('preview').innerHTML = this.value;
}
}
})();
</script>
<h1><code>setTimeout</code></h1>
<h2>1、未使用 <code>setTimeout</code></h2>
<button id="makeinput">生成 input</button>
<p id="inpwrapper"></p>
<h2>2、使用 <code>setTimeout</code></h2>
<button id="makeinput2">生成 input</button></h2>
<p id="inpwrapper2"></p>
<h2>3、另一个例子</h2>
<p><input type="text" id="input" value=""/><span id="preview"></span></p>
有用 | 无用
代码如下:
<script type="text/javascript" >
(function(){
function get(id){
return document.getElementById(id);
}
window.onload = function(){
get('makeinput').onmousedown = function(){
var input = document.createElement('input');
input.setAttribute('type', 'text');
input.setAttribute('value', 'test1');
get('inpwrapper').appendChild(input);
input.focus();
input.select();
}
get('makeinput2').onmousedown = function(){
var input = document.createElement('input');
input.setAttribute('type', 'text');
input.setAttribute('value', 'test1');
get('inpwrapper2').appendChild(input);
setTimeout(function(){
input.focus();
input.select();
}, 0);
}
get('input').onkeypress = function(){
get('preview').innerHTML = this.value;
}
}
})();
</script>
<h1><code>setTimeout</code></h1>
<h2>1、未使用 <code>setTimeout</code></h2>
<button id="makeinput">生成 input</button>
<p id="inpwrapper"></p>
<h2>2、使用 <code>setTimeout</code></h2>
<button id="makeinput2">生成 input</button></h2>
<p id="inpwrapper2"></p>
<h2>3、另一个例子</h2>
<p><input type="text" id="input" value=""/><span id="preview"></span></p>
有用 | 无用
猜你喜欢
您可能感兴趣的文章:
- javascript 流畅动画实现原理
- javascript 定义初始化数组函数
- JS 网页彩蛋 实现代码
- javascript十个最常用的自定义函数(中文版)
- javascript 获取select下拉列表值的代码
- Javascript中的var_dump函数实现代码
- jquery tools系列 expose 学习
- jquery tools系列 overlay 学习
- jquery tools 系列 scrollable(2)
- jquery tools 系列 scrollable学习
- javascript事件问题
- js跨域和ajax 跨域问题的实现思路
- JavaScript 密码强度判断代码
- 关于javascript中的parseInt使用技巧
- jquery判断单个复选框是否被选中的代码
- javascript 操作table的特性
- 当文本框的值发生改变时,触发事件,在IE中有效
- javascript 触发事件列表 比较不错
- javascript concat数组累加 示例