多重選擇及補充說明 (Checkable) 新提案 → 封閉測試 → 公開測試 → 已穩定 成熟度說明 新提案:未完成開發、請勿使用。 封閉測試:開發暫時性完成,可使用。可能仍有親和力或其他使用上問題待透過實測發現。 公開測試:開發暫時性完成,歡迎使用。具有完整親和力報告。 已穩定:開發完成、歡迎使用。應無任何親和力或使用上問題。 追加欄位 認證方式 健保卡 健保卡卡號 必填 自然人憑證 自然人憑證是可以在網路上作資料交換時,如同網路身分證辨識雙方身分。「憑證」包含了「數位簽章」跟「公開金鑰」。 行動自然人憑證驗證 實名手機門號 手機號碼 必填 正體中文 English (US) HTML <fieldset class="fieldset"> <label i18n-method class="field-label">認證方式</label> <div class="checkable-wrapper-v"> <div class="checkable-item"> <input class="chcecked--extra-fields" type="checkbox" name="identification" id="v-healthid-input" value="healthid"> <label for="v-healthid-input">健保卡</label> <div class="fields"> <fieldset class="fieldset"> <label for="healthid-required" class="field-label">健保卡卡號 <span class="field-required">必填</span></label> <input type="text" id="healthid-required" inputmode="number" aria-required="true" class="field-input"> </fieldset> </div> </div> <div class="checkable-item"> <input class="chcecked--extra-fields" type="checkbox" name="identification" id="v-moica-input" value="moica" checked> <label for="v-moica-input">自然人憑證 <div i18n-description class="desc"> 自然人憑證是可以在網路上作資料交換時,如同網路身分證辨識雙方身分。「憑證」包含了「數位簽章」跟「公開金鑰」。 </div> </label> <div class="fields"> <button i18n-tw-fido type="button" class="button button-primary">行動自然人憑證驗證</button> </div> </div> <div class="checkable-item"> <input class="chcecked--extra-fields" type="checkbox" name="identification" id="v-phone-input" value="phone"> <label for="v-phone-input">實名手機門號</label> <div class="fields"> <fieldset class="fieldset"> <label for="phone-required" class="field-label">手機號碼 <span class="field-required">必填</span></label> <input type="text" id="phone-required" inputmode="number" aria-required="true" class="field-input"> </fieldset> </div> </div> </div> </fieldset> CSS input.chcecked--extra-fields:加到 input[type=radio] 或 input[type=checkbox] 後即可在勾選後,顯示後方的 .fields 元件。