CODEWITHSUNDEEP
javascriptjqueryhtmlinternet-explorer-9
NedStarkOfWinterfell
NedStarkOfWinterfell

Reputation: 5153

Text Input focus anomaly in IE9

I am trying out this rather simple code. It is supposed to shift the focus to the neighboring text input whenever there is mouseup on the first one:

<!DOCTYPE html>
<html>  
  <head>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">   
    </script>
    <script>
      $(document).ready(function() {
        $(".foo").mouseup(function() {
          $(".boo").focus();
        });
      });   
    </script>
  </head> 
  <body>
    <input type='text' class='foo' />
    <input type='text' class='boo' />
  </body>    
</html>

In all browsers except IE9 (I didn't dare test it in IE8 or below!), it works fine for both left button and right button (for right button mouseup, the context menu still pops up on the first input even though the focus shifts to the 2nd one). However, in IE9, the focus still remains on the first text input (the context menu also popping up there).

Is there any way to fix it so that the focus shifts to the 2nd one?

Upvotes: 3

Views: 3039

Answers (2)

C..
C..

Reputation: 802

.select() in ie should work:

http://jsfiddle.net/n4hGC/5/

$(document).ready(function(){
  $('.foo').mouseup(function() {
    $('.boo').focus();
  });
  $('.foo').contextmenu(function() {
      $('.boo').select();
      return false;
  });
});

Have also handled the context menu by returning false. Hope helps!

Upvotes: 3

karancan
karancan

Reputation: 2162

Can you try one of these alternatives? They have worked for me in IE8 in the past and they might work for you.

Alternative 1: Blur then Focus

$(".foo").mouseup(function(){
    $(".boo").blur();  
    $(".boo").focus();
});

Alternative 2: Using setTimeout

$(".foo").mouseup(function(){ 
    setTimeout(function () {
        $(".boo").focus();
    }, 100);  
});

Upvotes: 3

Related Questions