2

I saw an example to use .is(":focus") to check if another object is in focus, but it's not working as expected. I'm using FireFox, and expect it to work in all browsers supporting jQuery.

Html:

 <input class=a value=a>
 <input class=b value=b>

 ^ focus on the input a
 How to make input.b stay visible when focus moves off .a and to .b?

Js:

 $(".a").focus(function(){
     $(".b").show();   
 });

 $(".a,.b").blur(function(){
     var f = false;
     if($(".a").is(":focus")) var f = true;
     if($(".b").is(":focus")) var f = true;
     if(!f) $(".b").hide();
 });  

Input.b always hides when i move focus to it, but it shouldn't.

Here's a fiddle, http://jsfiddle.net/7gXfC/1/

I don't see how else to do this

Control Freak
  • 12,965
  • 30
  • 94
  • 145

1 Answers1

1

It's a work around, but you can try this:

$(".a").focus(function(){
    $(".b").show();   
});

/*
   Added a timeout so b.focus event occurs before a.blur
*/
$(".a").blur(function(){
    setTimeout(function() {
        if(!$(".b").is(":focus")) $(".b").hide();
    }, 50);
});

$(".b").focus(function(){
    $(".b").show();
});

$(".b").blur(function(){
    $(".b").hide();
});

Fiddle

John Bupit
  • 10,406
  • 8
  • 39
  • 75