Menu
I have problem with focus event handling in the code below in IE8 I get the following output:
LOG: set focus txt1
LOG: set focus txt2
LOG: txt1 focus
LOG: txt2 focus
but in all other browsers the output is:
LOG: set focus txt1
LOG: txt1 focus
LOG: set focus txt2
LOG: txt2 focus
it seems that IE8 queues all focus requests and executes event handlers after current function ends.
Is there any workaround to force IE8 to behave nicely like other browsers?
<html>
<head>
</head>
<body>
<script>
function test(){
console.log('set focus txt1');
document.getElementById('txt1').focus();
console.log('set focus txt2');
document.getElementById('txt2').focus();
}
</script>
<input id="txt1" type="text" onfocus="javascript:console.log('txt1 focus')" style="width:100px" />
<input id="txt2" type="text" onfocus="javascript:console.log('txt2 focus')" style="width:100px" />
<button value="Click" onclick="javascript:test()"></button>
</body>
</html>
490
IE delays the actual focus until after the function test() is completed, so I am afraid you have to use a construction like:
function test(){
console.log('set focus txt1');
document.getElementById('txt1').focus();
window.setTimeout(function() {
console.log('set focus txt2');
document.getElementById('txt2').focus();
}, 1);
}
Here I postpone the second part of the function so that IE will have time to set the focus on txt1 before the second part is executed.
By the way, you should omit the prefix javascript: in the onclick and onfocus attributes. The javascript: prefix should only be used in a href attribute.
195
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
