jQuery focus（）有时候在IE8中不起作用 [英] jQuery focus() sometimes not working in IE8
问题描述
我正在使用jQuery开发webapp。
我有添加3行输入字段的新功能。创建这些DOM元素后，我想要关注一个输入字段。我在必要的输入字段上调用jQuery focus（）函数。
I am developing webapp using jQuery. I have functionality that adds new row of 3 input fields. After creating these DOM elements I want to focus one of input fields. I am doing it with calling jQuery focus() function on necessary input field.
问题是调用focus（）在IE6和FF3.5中正常工作，但是没有工作在IE8中。
Problem is that calling focus() works fine in IE6 and FF3.5, but not working in IE8.
我试图在这里显示这个问题的简单工作示例，但是使用剥离版本的代码focus（）工作正常。所以我的猜测是，当我在IE8中调用focus（）时，DOM还没有准备好。为此，我尝试调用setTimeout（'myFocus（）'，400）。我取得了成功，在某些情况下，重点确实在起作用，但仍然并非总是如此。随机它不会集中我的输入字段。
I was trying to make simple working example of this problem for showing it here, but with stripped version of code focus() is working fine. So my guess was that DOM is not ready yet when I call focus() in IE8. For this I tried calling setTimeout('myFocus()',400). I had success and in some of cases focus was really working but still not always. Randomly it does not focus my input field.
问题是：是否有人遇到类似的问题，是否有人知道如何解决它？使用setTimeout感觉非常难看。
Question is: Has anybody faced similar problems and does anybody have any idea how to workaround it? Using setTimeout feels like very ugly workaround.
提前Tnx
编辑：26.08.2009
Edited : 26.08.2009
成功复制简单示例。这是在IE8上重现此错误的HTML + JS代码。
Succeeded to reproduce on simple example. Here is HTML+JS code that reproduces this bug on IE8.
<html>
<head>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
function performChanged() {
formChanged = true;
}
function handleChange() {
var parentDiv = $('#container');
newValue = $(html).html();
parentDiv.html(newValue);
$(".sel1",parentDiv).bind('change',handleChange);
//alert('Uncomment this and after alert focus will be on input');
$("input.cv_values",parentDiv).focus();
}
$(document).ready(function() {
$('.trackChange').bind('change', handleChange);
});
var html = '<div class=\"div1\">\n<select class=\"sel1\" id=\"sel1\" name=\"sel1\"><option value=\"\"><\/option>\n<option value=\"11\">Select me to see problem<\/option>\n<\/select>\n\n\n<input class=\"cv_values\" id=\"sel3\" name=\"sel3\" size=\"30\" type=\"text\" value=\"\" /><br/>Focus should in input field. With alert it is but without alert focus is not there</div>';
</script>
</head>
<body>
<select class="trackChange" onchange='performChanged();'>
<option value=""></option>
<option value="1" >Select me to generate new inputs</option>
</select>
<div id="container"></div>
</body>
重现：
1）从第一个下拉列表中选择值。您将看到第一次输入正在工作
2）从第二次下拉菜单中选择值。您将看到该bug被复制。
To reproduce: 1) select value from first dropdown. You will see that first time input is working 2) select value from second dropdown. You will see that bug is reproduced.
然后在代码中您可以注释掉显示JS alert（）的行。奇怪的是，如果有这个警报（）然后焦点工作正常。
Then in code you can comment out line where it shows JS alert(). Strange thing is that if there is this alert() then after it focus is working fine.
希望这有助于了解我的问题所在。
Hope this helps to understand where my problem is.
PS我需要我的应用程序以这种方式工作 - 它从下拉列表中选择值后重新生成这些输入。这是我的应用程序的简化示例;）。
P.S. I need my app to work this way - it is regenerating those inputs after selecting value from dropdown. This is simplified example of my app ;).
推荐答案
奇怪的是我遇到了同样的问题并使用普通的旧javascript解决了它：
Strangely i had the same problem and resolved it using plain old javascript like so:
document.getElementById（'friend_name'）。focus（）;
使用jQuery等效 $（'＃friend_name'）。focus（）; 在IE8中不起作用： - /
Using jQuery equivalent $('#friend_name').focus(); didn't work in IE8 :-/
这篇关于jQuery focus（）有时候在IE8中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
