Why jquery.animate on a textarea make the blinking cursor disapears?
I have the following code
$(document).ready(function() {
$("#myTextArea").focus(function() {
$("#myTextArea").animate({ "height": "75px"}, "normal");
return false;
});
to expand a textbox when it gets focus. The expand occurs, however the blinking cursor disapears, at least in Firefox!
Edited: The textarea is still focused, and i can type on it.
开发者_StackOverflow中文版Why does this happen? Is there a way to show it again?
Thanks in advance
Your return false
statement is cancelling the focus
action :) You only get a cursor when the element is focused, I'd just remove this line from your function.
Aside from that, .focus()
in a text area isn't something you can reclaim easily, because it had a position that matters, you're better off sticking with a CSS change here:
$("#myTextArea").focus(function() {
$(this).css({ "height": "75px" });
});
This won't affect cursor behavior at all and work the saema cross browsers (focus
is still different amongst browsers), but of course won't animate. The alternative (I haven't tested this in all browsers) is that you could trigger the focus again with the same args after the animate, restoring the position, like this:
$("#myTextArea").focus(function(e) {
if($(this).height() == 75) return;
$(this).animate({ height: 75}, "normal", function() {
$(this).blur().trigger(e);
});
});
You can test this from here, just be sure to check all browsers, as focus
behavior can vary slightly between them.
精彩评论