Question

I have a form called #status. I would like to if you focus on the form input, #statusUpdate, then the submit button, #submitStatus should appear.

I’ve did this:

$("#statusUpdate").focus(function(){
    $("#submitStatus").show();
});

$("#statusUpdate").blur(function(){
    $("#submitStatus").hide();
});

This works fine, now my issue is when the #submitStatus appears, and you want to click on it, it disappears in the same splitsecond, because the #statusUpdate focus gets lost (blur) and therefore hides it.

How can this be fixed?

Answer 1

odd design 😉
You can wrap hide in a setTimeout like this

setTimeout(function() { $("#submitStatus").hide(); }, 100)

or use jQuery delay (requires adding some param to hide())