0

Can't move focus to the control because it is invisible, not enabled, or of a type that does not accept the focus

jQuery threw the above error on IE8.

I'd like to be able to detect if the browser supports focus on disabled elements (an input in my case), and store it in jQuery.support.

How would I do this?

A plain JS solution would be fine, but I don't want to use browser sniffing (jQuery.browser, etc).

Would using dispatchEvent() be a good way to go?

Adam Lynch
  • 3,341
  • 5
  • 36
  • 66
  • you mean disabled `` elements? – Muthu Kumaran Dec 06 '12 at 16:22
  • 1
    any reason you don't want to check if control is visible and enabled before setting focus to it? – Arsen Mkrtchyan Dec 06 '12 at 16:22
  • @ArsenMkrt In other browsers this works fine. There's third party stuff triggered on focus, so I don't want to check if it's visible. That would block that use in other browsers unless I did browser sniffing. Also, I would just prefer to do a check and store the result in `jQuery.support` when the page loads. – Adam Lynch Dec 06 '12 at 16:27
  • What version of jQuery are you using? i can't seem to get it to throw said error in 1.8.2 on a disabled element. – Kevin B Dec 06 '12 at 16:42
  • @KevinB I'm using 1.7.2. I'll try 1.8.2 – Adam Lynch Dec 06 '12 at 16:51
  • @KevinB The element needs to be in the DOM before you focus it. Adam, the problem occurs in 1.8.2 as well (just tested in jsfiddle) – Asad Saeeduddin Dec 06 '12 at 16:51
  • @Asad thanks for that. I was having frustrating problems clearing my cache anyway. – Adam Lynch Dec 06 '12 at 17:06

1 Answers1

4

I suppose you could just try, catch exactly that (focusing a disabled element), and store a value in support if anything borks.

var test = $('<input disabled/>');
$(document.body).append(test);
try{
    test.focus();
}catch(e){
    //no support, do your thing
    //...
}
//clean up test element
test.remove();
Asad Saeeduddin
  • 46,193
  • 6
  • 90
  • 139
  • lol.. I couldnt think of anything else myself but was afraid to post as a solution in fear of the wrath of the SO critics.. lol..good on ya..+1 – Sajjan Sarkar Dec 06 '12 at 17:00
  • Why not go to a lower level? Could I try using `dispatchEvent()`? – Adam Lynch Dec 06 '12 at 17:07
  • @AdamLynch Why go to a lower level? You could certainly try, but I don't see the point, seeing as somewhere in the code for `focus()` this is already happening. – Asad Saeeduddin Dec 06 '12 at 17:08
  • Maybe it would be faster (I'm not sure if that's true). Like how using `$('#id').find('.class')` is faster than using `$('#id .class')` because jQuery eventually decides it should use the former when given the latter after some time. – Adam Lynch Dec 06 '12 at 17:34
  • @AdamLynch This is a one time check, not an iteration. It can at most improve your performance by a millisecond or two. – Asad Saeeduddin Dec 06 '12 at 17:35
  • Ugh. Got this really weird bug now. The `catch` above breaks a placeholder polyfill (I'm using [this one](https://github.com/miketaylr/jQuery-html5-placeholder) I think) in IE8 (the placeholder is not hidden on click/focus of field, with no errors). What's strange is that it works if I comment out the above catch. It breaks even if the exception is renamed or the catch is even empty. Any ideas? Can't find anything related online – Adam Lynch Dec 07 '12 at 14:32
  • @AdamLynch I'll get back to you tomorrow. – Asad Saeeduddin Dec 07 '12 at 14:34
  • @AdamLynch Could you make a jsFiddle? – Asad Saeeduddin Dec 08 '12 at 13:32
  • @Asad, here you go: working [without try-catch](https://raw.github.com/miketaylr/jQuery-html5-placeholder/master/html5placeholder.jquery.min.js), not working [with the try-catch](http://jsfiddle.net/57wgy/6/) – Adam Lynch Dec 10 '12 at 15:41
  • It seems like it's the `focus` call that is causing problems outside of the try-catch, the try-catch [doesn't seem to be a problem on it's own](http://jsfiddle.net/57wgy/7/) – Adam Lynch Dec 10 '12 at 15:45
  • Ok, [got it](http://jsfiddle.net/57wgy/8/). This seems like unexpected behaviour to me, gonna add an issue to the jQuery GitHub. – Adam Lynch Dec 10 '12 at 15:51