Submit Depression Button to Focus - Potential Chrome Error?

Question

What about submit buttons in Chrome?

<input type='text' placeholder='Dummy Input'/> <input type='submit'/> 

The active state of "pressing" the submit button will appear only if the button has no focus . To reproduce, see this JSFiddle . In fact, the text box is not even needed, just to include the tab in the submit button.

So, place the cursor in the text box, press tab and click "Submit" when the button is focused (orange). The event fires, but the button is not pressed.

Pressing the spacebar while focusing, rather than pressing, presses the button. (thanks @Ineentho) What gives?

Note. I sent this to Chrome Issue Tracker

Answer 1

Confirmed Chrome error.

See the problem presented: Chrome Issue 240137 , which was just combined with Chrome Issue 238560 .

Giving @ SzőkePéter Award for a temporary workaround.

Answer 2

You can use javascript / jquery to not focus the text field on hovering, therefore: when clicked, active properties will be applied.

 $("input[type=submit]").hover(function(){ $(this).blur(); }); 

Alternatively, you can apply css to the: focus pseudoword, so the path will always be invisible.

 input[type=submit]:focus {outline:none;} 

See this script: http://jsfiddle.net/qahcJ/1/

UPDATE

I think you cannot solve this problem without hacking Javascript, so this is a much simpler way to do this. Just use this piece of code:

 $("input[type=submit]").bind("mousedown",function(e){ return false; }); 

Demo: http://jsfiddle.net/gFMTt/