I have a textbox that's being automatically focused with jQuery when an element is clicked:
my_item.find('input').focus();
It works in Firefox and Chrome as expected: the input area is focused and I can begin typing in it. In Safari the behavior is different though. I click the element, the input is focused, I start to type in the box, and it only lets me type one character. After the first character of input is typed, the input box loses focus and further typing doesn't work unless it's manually clicked for focus again.
I've found questions about focus()
and Safari working strangely but I think this is a different issue. I've tried the solutions suggested there, such as e.preventdefault()
on mouseup
and similar, with no effect.
How can I get my focused text input area to remain focused while I'm typing in Safari?
I have a textbox that's being automatically focused with jQuery when an element is clicked:
my_item.find('input').focus();
It works in Firefox and Chrome as expected: the input area is focused and I can begin typing in it. In Safari the behavior is different though. I click the element, the input is focused, I start to type in the box, and it only lets me type one character. After the first character of input is typed, the input box loses focus and further typing doesn't work unless it's manually clicked for focus again.
I've found questions about focus()
and Safari working strangely but I think this is a different issue. I've tried the solutions suggested there, such as e.preventdefault()
on mouseup
and similar, with no effect.
How can I get my focused text input area to remain focused while I'm typing in Safari?
Share Improve this question edited Mar 30, 2020 at 16:54 Brian Tompsett - 汤莱恩 5,89372 gold badges61 silver badges133 bronze badges asked Jan 21, 2015 at 15:29 bethbeth 2,0064 gold badges24 silver badges39 bronze badges1 Answer
Reset to default 10The question is a bit old, but i recently had the same problem so this is what i´ve found. Check if your css rules blocks the touch callout. If you have any rule like this try to remove and then try typing again
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;