Javascript 在jQuery高度动画之后关注Webkit中的文本区域

我有一个jQuery事件处理程序，基本上如下所示：

$("textarea").live("focus, click", function() {
  var o = $(this),
      expand_height = "60px";
  o.animate({height : expand_height});
}

如您所见，onfocus或onclick应该设置文本区域从初始高度（20px）扩展到扩展高度（60px）的动画。实际上，它还做了一些其他事情（比如清除默认值），但这是唯一给我带来麻烦的部分

在Firefox/IE中，文本区域保持焦点，同时高度设置动画，用户可以在单击文本区域后立即开始键入。在Chrome/Safari中，文本区域失去焦点，因此用户无法在框中键入内容。如果在动画完成时添加回调以聚焦长方体，则该回调无效。如果像下面的示例中那样添加select（）.focus（），则它确实有效：

$("textarea").live("focus, click", function() {
  var o = $(this),
      expand_height = "60px";
  o.animate({height : expand_height}, function() {
   o.select().focus();
  });
}

不幸的是，当用户单击并开始键入时，前几个字符可能会丢失，因为它们必须等待动画完成

这是webkit的错误吗？如何让动画运行并立即响应用户的键入

这可能是一个已知的问题。显然，

onmouseup

事件的触发取消了对文本的选择。此问题以及涉及

preventDefault（）

的解决方案将在中讨论。

这可能是一个已知的问题。显然，

onmouseup

事件的触发取消了对文本的选择。此问题以及涉及

preventDefault（）

的解决方案将在中讨论。

尝试以下方法：

$("textarea").live("focus, click", function() {
  var o = $(this),
      expand_height = "60px";
  o.animate({height : expand_height}, function() {
       o.style.display = 'block';
  });
});

试试这个：

$("textarea").live("focus, click", function() {
  var o = $(this),
      expand_height = "60px";
  o.animate({height : expand_height}, function() {
       o.style.display = 'block';
  });
});

---

谢谢你的快速回复。事实上，我看到了这个问题，并在提问之前尝试了解决方案。我添加了$（“textarea”）.live（“mouseup”，函数（e）{e.preventDefault（）}）；这在这种情况下不起作用。感谢您的快速响应。事实上，我看到了这个问题，并在提问之前尝试了解决方案。我添加了$（“textarea”）.live（“mouseup”，函数（e）{e.preventDefault（）}）；这在这种情况下不起作用。