Почему jquery.animate на textarea заставляет исчезать мигающий курсор? - PullRequest
Новая
       25

Почему jquery.animate на textarea заставляет исчезать мигающий курсор?

3 голосов
/ 15 апреля 2010

У меня есть следующий код 

$(document).ready(function() {
    $("#myTextArea").focus(function() {
        $("#myTextArea").animate({ "height": "75px"}, "normal");
        return false;
    });

, чтобы развернуть текстовое поле, когда оно получает фокус. Расширение происходит, однако мигающий курсор исчезает, по крайней мере, в Firefox!

Отредактировано: текстовая область все еще сфокусирована, и я могу печатать на ней.

Почему это происходит? Есть ли способ показать это снова?

Заранее спасибо

1 Ответ

3 голосов
/ 15 апреля 2010

Ваш оператор return false отменяет действие focus :) Вы получаете курсор только тогда, когда элемент находится в фокусе, я просто удалю эту строку из вашей функции.

Кроме того, .focus() в текстовой области - это не то, что вы можете легко восстановить, поскольку у него есть позиция, которая имеет значение, вам лучше придерживаться изменения CSS здесь: 

$("#myTextArea").focus(function() {
    $(this).css({ "height": "75px" });
});

Это никак не повлияет на поведение курсора и будет работать в кросс-браузерах saema (focus по-прежнему отличается среди браузеров), но, конечно, не будет анимироваться. Альтернатива (я не проверял это во всех браузерах) состоит в том, что вы могли бы снова активировать фокус с теми же аргументами после анимации, восстанавливая положение, например так: 

$("#myTextArea").focus(function(e) {
    if($(this).height() == 75) return;
    $(this).animate({ height: 75}, "normal", function() {
        $(this).blur().trigger(e);
    });
});​

Вы можете проверить это здесь , просто проверьте все браузеры, так как поведение focus может незначительно отличаться между ними.

...