Question

我正在尝试构建一个类似Google文档的应用，其中包含带有textarea的网页，以及更改我发布的值并更新到服务器，并从更新DOM的服务器获取保存的响应。

问题在于稍后更新DOM会删除用户需要继续键入的textarea焦点。焦点丢失，用户必须再次点击textarea以获得焦点并继续输入。

如何在服务器上远程更改值并将其发送到客户端时，如何克服失去焦点的问题。

Answer 1

您可以在模板上使用会话变量和rendered回调来执行此操作。这是一个使用带有一个textarea的模板的简单示例：

<template name="home">
  <textarea></textarea>
</template>

Template.home.events({
  'focus textarea': function() {
    Session.set('hasFocus', true);
  },
  'blur textarea': function() {
    Session.set('hasFocus', false);
  }
});

Template.home.rendered = function() {
  if (Session.get('hasFocus')) {
    $('textarea').focus();
  }
};

Template.home.destroyed = function() {
  return Session.set('hasFocus', undefined);
};

当您对textarea进行聚焦或模糊时，我们会修改会话变量hasFocus。每当渲染模板时，我们只需基于相同的变量聚焦textarea。完成模板后，只需清理hasFocus，这样就不会干扰其他页面。

Answer 2

您是否尝试在{{#ststant}} {{/ constant}}标签中包装该元素？

来自服务器的Meteor发布信息会更改DOM并删除元素上的键盘焦点

2 个答案: