跳到主要內容
  • 字級
:::|

TS2觸發操作

規則識別碼

TS2

規則名稱

觸發操作

規則類型

原子規則

規則說明

觸發操作以向上事件為主,需有防止誤觸設計

無障礙要求對應

網站無障礙規範

  • 2.5.2指標取消(檢測等級A)
    • 必須符合 WCAG 2.0和WCAG 2.1 A級或更高級別
    • 結果對應:
      • 任何失敗結果:不符合
      • 所有成功結果:需進一步測試
      • 未適用結果:需進一步測試

適用性

適用於觸發內容。

期望

以下檢查均正確:

  • 物件、元件和控件在啟動開始時(當觸摸時)不會直接觸發動作/事件。
  • 當使用者完成啟動(觸摸已移開)時,物件、元件和控件將觸發操作/事件。

假設條件

此規則目前無已知的假設條件。

無障礙支援

此規則沒有已知的主要無障礙功能支援問題。

測試案例:

作業系統

iOS

Android

HTML

範例說明

預設使用原生UIKit視圖與網頁元素處理觸控事件(包含多點觸控事件),並僅在觸摸移開時做出回應。然而,必須額外投入心力確保在自定義視圖使用手勢識別或追蹤觸控之觸控事件正確性。

預設使用原生Android元素處理觸控事件。自定義動作可使用動作事件與按鍵事件來執行。然而,需注意每個事件類型回傳的資訊取決於裝置類型與輸入裝置。

預設使用原生HTML元素處理觸控事件。盡可能使用onclick和onkeypress事件觸發動作。

成功範例原始碼

--

//A touch event listener attached to an element to perform an action on ACTION_UP

 

@Override public boolean onTouchEvent(MotionEvent event) {

int action=event.getAction();

if(action==MotionEvent.ACTION_UP){

...

}

 

return false;

}                  

<!-- Preferable (native elements) -->

<button onclick="…">Click me to do something!</button>

 

<!-- Custom actions -->

<script>

function startGesture(e) {

  // store touch start source

}

function endGesture(e) {

  // if touch end source is different from touch start source return, else perform action

}

</script>

...

<div onTouchStart="startGesture(this);" onTouchEnd="endGesture(this);"> Swipe area </div>

失敗範例原始碼

-

//A touch event listener attached to an element to perform an action on ACTION_DOWN

 

@Override public boolean onTouchEvent(MotionEvent event) {

int action=event.getAction();

if(action==MotionEvent.ACTION_DOWN){

...

}

 

return false;

}   

<script type="text/javascript">

function startGesture(e) {

  // perform action

}

</style>

...

<div onTouchStart="startGesture(this);"> Swipe area </div>

測試程序

  1. 使用觸控螢幕瀏覽該應用程式。
  2. 導航到螢幕上的物件、元件和控件。
  3. 開始啟動一個項目(觸摸時無需抬起手指或手寫筆)。
  4. 驗證該項目不會立即觸發動作/事件。
  5. 完成啟動項目(從螢幕上移開手指或手寫筆)。
  6. 驗證該項目觸發動作/事件。

參考詞彙:無

變更記錄:20200817-第1次編撰。

參考資源:
Appropriate Triggers , 2019 BBC行動裝置無障礙指南(MOBILE ACCESSIBILITY GUIDELINES)。