跳轉到內容

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
華夏公益教科書