开发者

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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜