跳转到内容

XForms/设置初始光标

来自维基教科书,自由的教科书

当表单加载时,您希望设置初始光标位置,以便用户的第一次按键输入到第一个字段中。这可以防止用户在表单上用鼠标选择第一个字段。虽然有些人认为这是“修饰”,但它是认真负责的开发者的标志。

要执行此任务,您需要执行两件事。首先,您需要为希望接收第一个按键事件的控件提供一个id属性。例如

<xf:input id="first-field">
   <xf:label>Search</xf:label>
</xf:input>

下一步是使用xforms-ready事件使用setfocus元素将焦点设置到此字段。

这些初始操作通常放在 HTML 标题中模型的末尾,但在正文之前。

<xf:model>
   ...
   <xf:action ev:event="xforms-ready">
      <xf:setfocus control="first-field" />
   </xf:action>
   ...
</xf:model>
[编辑 | 编辑源代码]

加载 XForms 应用程序

源代码

[编辑 | 编辑源代码]
<html
   xmlns="http://www.w3.org/1999/xhtml"
   xmlns:xf="http://www.w3.org/2002/xforms" 
   xmlns:xs="http://www.w3.org/2001/XMLSchema"
   xmlns:ev="http://www.w3.org/2001/xml-events" >
   <head>
      <title>Initial Cursor Positioning</title>
      <xf:model>
          <xf:instance xmlns="">
              <data>
                  <element1/>
              </data>
          </xf:instance>

      <xf:action ev:event="xforms-ready">
         <xf:setfocus control="first-field" />
      </xf:action>
      </xf:model>
   </head>
   <body>
      <h3>Initial Cursor Positioning</h3>
      <xf:input ref="element1" id="first-field">
         <xf:label>Element One:</xf:label>
      </xf:input>
   </body>
</html>
下一页: 选择和取消选择事件 | 上一页: 事件概述
首页: XForms
华夏公益教科书