如何使用 Lift（Scala 框架）将焦点集中在文本框上？

Question

请原谅我的问题极其简单，但我对 Lift（以及 Scala）的世界还很陌生。

我正在按照 Lift 网站上的“入门”教程进行操作：http://liftweb.net/getting_started

我已经启动并运行，但我想对应用程序进行快速修改，以便每次我在文本框中按 Enter 时，它都能保持焦点。我已经设法使用 FocusOnLoad 让它专注于页面加载，但我不太清楚如何让它保持焦点（仅使用 Lift 的类，没有自定义 JavaScript）。

这是我的 def render 方法（绑定部分）代码的样子：

def render =
    bind("chat", // the namespace for binding
    "line" -> lines _, // bind the function lines
    "input" -> FocusOnLoad(SHtml.text("", s => ChatServer ! s)) )

这样可以让它专注于页面加载。但由于这是 Comet 应用程序，因此页面仅加载一次。

我的所有其他代码看起来与教程 FWIW 完全相同。

Answer 1

CometActor 中的 render 方法仅在 CometActor 首次初始化时才会被调用，这会在用户第一次进入聊天页面时发生。之后，页面更新通常发生在 lowPriority 或 highPriority 方法内部。因此，如果您希望文本框在用户向 CometActor 发送 AJAX 更新后获得焦点，您应该将其添加到这些方法之一。使用 JQuery 的一个例子是这样的：

override def lowPriority = {
  case m: List[ChatCmd] => {
    val delta = m diff msgs
    msgs = m
    updateDeltas(delta)
    partialUpdate((JqJE.Jq(JE.Str("input[type=text]")) ~> (new JsRaw("focus()") with JsMember)).toJsCmd)
  }
}

我还没有尝试编译它，所以它可能需要一些轻微的调整。本质上，它只是向浏览器发送另一个 JavaScript 命令，该命令使用 JQuery 查找页面上的文本输入，然后将焦点设置在该控件上。如果有多个文本输入，则需要修改 HTML 模板上要设置焦点的控件的类，然后确保将渲染方法更改为：

def render = 
  bind("chat",
       "line" -> lines _,
       "input" -%> FocusOnLoad(SHtml.text("", s => ChatServer ! s)) )

-%>< /code> 方法指示 Lift 在绑定阶段不要忽略模板中的任何属性。然后，您可以修改 JQuery 选择器以使用该类来查找要关注的正确控件。 Lift 中的部分表单安全性会隐藏分配给表单及其控件的 ID，以防止 XSS 攻击，因此通常最好使用类选择器来使用 JQuery 或其他一些 Javascript 框架查找表单控件。