動機

XForms 建立了一種通用方式來表示按鈕，它可以在網頁和手機上工作。但它不像大多數其他系統那樣被稱為“按鈕”。它是一個抽象或按鈕的概括，稱為 a trigger。觸發器是對網頁按鈕或其他事件的抽象，例如手機上的按鈕。使用觸發器抽象可以讓您的 XForms 更加便攜。

螢幕影像

示例程式

<html
 xmlns="http://www.w3.org/1999/xhtml"
 xmlns:xf="http://www.w3.org/2002/xforms"
 xmlns:ev="http://www.w3.org/2001/xml-events"
>
   <head>
      <title>Button Example</title>
      <xf:model>
         <xf:instance xmlns="">
             <data/>
         </xf:instance>
      </xf:model>
   </head>
   <body>
      <xf:trigger>
          <xf:label>Button</xf:label>
          <xf:hint>If you press this you will get a hello world message.</xf:hint>
          <xf:message level="modal" ev:event="DOMActivate">Hello World!</xf:message>
      </xf:trigger>
   </body>
</html>

討論

此示例同時包含標籤和提示。 XForms 還具有可用於幫助文字，但幫助的實現方式是特定於實現的。

觸發器樣式

預設情況下，每個觸發器看起來像一個 HTML 按鈕。您可以透過設定 appearance="minimal" 來關閉它。

<xf:trigger appearance="minimal">
   <xf:label>Save</xf:label>
</xf:trigger>

讓按鈕觸發多個事件

當您按下按鈕 (觸發器) 時，您有時希望觸發器執行的不僅僅是單個提交。每當您想這樣做時，您只需新增一個 action 元素並將多個傳送包裝在 action 中

<xf:trigger>
   <xf:label>Submit</xf:label>    
   <xf:action ev:event="DOMActivate">
      <xf:send submission="getTime"/>
      <xf:send submission="getTemperature"/>
    </xf:action>
</xf:trigger>

參考文獻

W3C 觸發器元素

FireFox CSS 樣式提示

下一頁: 控制按鈕外觀 | 上一頁: 上傳
首頁: XForms