Tips & Tricks

如何將單選按鈕新增至 PDF 表單

單選按鈕是PDF 表單中提供的核心輸入控制項之一。當新增至可填寫文件時,它們為使用者提供了一種清晰的方法,可以從一組互斥的選項中準確選擇一個選項。常見的範例包括選擇付款方式、選擇運送速度、回答是或否問題或在回饋表上選擇滿意度評級。

在 PDF 表單中新增單選按鈕與新增文字欄位所需的工作量大致相同,但正確分組才是功能表單與令人困惑的表單的區別所在。當單選按鈕共用相同的群組名稱時,選擇一個單選按鈕會自動取消選擇該群組中的所有其他單選按鈕。當它們具有不同的名稱時,它們表現為獨立的複選框,這幾乎不是您想要的單選題。本指南涵蓋了 Adobe Acrobat Pro、線上編輯器和WukongPDF的步驟,以及新手錶單作者經常錯過的配置詳細資訊。

WukongPDF 的可填入 PDF 編輯器將所有表單控制項(包括單選按鈕、複選框、文字欄位和下拉式選單)放置在單一工具列中,無需下載或安裝軟體即可存取。新增單選按鈕後,儲存表單即可分發。

How to Add Radio Buttons to a PDF Form

單選按鈕與複選框與下拉式選單

了解這三種欄位類型之間的差異可以防止最常見的表單設計錯誤:在單選按鈕所屬的位置使用複選框。單選按鈕強制指定群組內的相互排他性。複選框是獨立的;選中其中一個複選框不會影響任何其他複選框。下拉式選單也強制執行單選,但使用緊湊的清單格式。

單選按鈕複選框下拉選單
從一組中選擇一個多種選擇,獨立單項選擇,緊湊列表
按欄位名稱分組每個盒子都是獨立的一個字段中的所有項目
最適合 2-5 個選項最適合是/否或多選最適合 4 個以上選項

當所有選項需要同時可見且使用者必須準確選擇一個時,請使用單選按鈕。當選項超過五個且螢幕空間有限時,請使用下拉式選單。當使用者可以獨立選擇任意數量的選項(包括零)時,請使用複選框。

WukongPDF

嘗試編輯 PDF

無需安裝。直接在您的瀏覽器中工作。

立即開始 →

在 Adobe Acrobat Pro 中新增單選按鈕

在 Acrobat Pro 中開啟 PDF 並導航至“工具”,然後導航至“準備表單”。 Acrobat 掃描文件以尋找表單欄位候選項並建議展示位置。對於手動放置,請按一下工具列中顯示為小圓圈的單選按鈕圖示。按一下要顯示第一個單選按鈕的頁面。分配了一個預設名稱,如 Group1。

接下來是關鍵的一步。對於同一組中的第二個單選按鈕,您必須為其指定與第一個單選按鈕完全相同的欄位名稱。如果第一個按鈕名為 PaymentMethod,則該群組中的每個後續單選按鈕也必須命名為 PaymentMethod。 Acrobat 將提示您警告:您已建立一個同名的單選按鈕。選擇是,我希望具有此名稱的所有單選按鈕共用單一值集。此確認會啟動互斥行為。如果您不小心給第二個按鈕起了不同的名稱,這兩個按鈕將用作獨立的切換按鈕,而不是連結的單選按鈕。

將所有按鈕放入群組後,雙擊任一按鈕以開啟「屬性」對話方塊。在選項標籤下,為群組中的每個按鈕指派唯一的按鈕值,例如信用卡、PayPal 或銀行轉帳。該導出值出現在匯出的表單資料中。在「外觀」標籤下,為所有按鈕設定一致的字體大小和邊框樣式。儲存 PDF 並透過點擊每個按鈕來測試該群組。一次只能填充一個。

使用線上 PDF 編輯器新增單選按鈕

線上 PDF 編輯器透過自動對共享相同名稱的按鈕進行分組來簡化單選按鈕工作流程。上傳PDF後,選擇單選按鈕工具,然後按一下頁面放置第一個選項。在右側開啟的屬性面板中,鍵入群組名稱和該特定按鈕的選擇值。放置下一個單選按鈕,為其指派相同的群組名稱,並為其指定不同的選擇值。

大多數線上編輯器在欄位清單中顯示單選按鈕,並帶有可擴展的樹視圖,顯示群組名稱和嵌套在下面的每個單獨的選擇。這種視覺回饋可以輕鬆確認所有預期按鈕屬於同一組。如果按鈕出現在樹外部,請將其拖曳到欄位清單中的正確群組中。放置所有按鈕後,下載完成的 PDF 並在閱讀器中測試群組行為。

設定預設選擇和樣式選項

單選按鈕可以在表單開啟時載入預先選擇的一個選項。在「屬性」對話方塊的「選項」標籤下,透過選擇某個選項並點選「預設」按鈕,將其設為預設值。載入表單時,預選選項將顯示為已填入。當一種選擇適用於大多數使用者時使用此選項,例如當大多數客戶選擇標準運輸時預先選擇它。不要預先選擇同意問題或法律協議的選項;這些必須始終需要明確的使用者操作。

單選按鈕的大多數視覺外觀對於可用性都很重要。預設外觀(選擇時為實心填充的小圓圈)在白色背景上效果很好,但在彩色表單部分上可能很難看到。在「外觀」標籤中,您可以變更按鈕的邊框顏色和填滿顏色以提高對比度。為了實現可訪問性,請確保單選按鈕圓圈的直徑至少為 11 磅,並且與頁面背景具有足夠的顏色對比度,如 WCAG 2.1 SC 1.4.11 所建議。

常見陷阱以及如何避免

在實踐中,最常見的錯誤是建立具有不同欄位名稱的單選按鈕並期望它們作為一個群組工作。放置所有按鈕後,打開“字段”面板並掃描清單。群組中的所有按鈕必須共用完全相同的名稱,僅其各自的選擇值有所不同。如果您看到 PaymentMethod、PaymentMethod1 和 PaymentMethod2 作為單獨的欄位名稱,請刪除後兩個並使用正確的共用名稱重新建立它們。

當表單作者複製並貼上單選按鈕以建立其他選項時,會出現另一個問題。複製會複製選擇值以及欄位名稱,這表示所有貼上的按鈕在匯出的資料中報告相同的值。始終變更每個單選按鈕實例的選擇值,即使欄位名稱是共用的。如果您的表單將在行動裝置上完成,請測試手機螢幕上的單選按鈕間距。距離太近的按鈕很難用指尖準確地點擊。單選按鈕行之間至少留出 24 像素的垂直空間,以適應觸控輸入。

單選按鈕將原本模稜兩可的問題轉變為清晰、結構化的資料點。透過將它們正確分組在共享名稱下並為每個選擇分配唯一的匯出值,您可以產生直接匯入資料庫和電子表格中的表單數據,而無需手動清理。

增加單選按鈕以實現輔助功能合規性

可存取的單選按鈕群組可協助依賴螢幕閱讀器、鍵盤導航或高對比度模式的使用者與表單正確互動。群組中的每個單選按鈕都應該有一個工具提示,描述群組名稱和特定選擇。在 Acrobat Pro 中,開啟欄位屬性,轉到常規選項卡,然後在工具提示欄位中填寫文本,如選擇您的付款方式:信用卡。當使用者使用 Tab 鍵進入該欄位時,螢幕閱讀器會宣布工具提示。

單選按鈕組的 Tab 鍵順序應依序在每個選項中移動。使用者透過 Tab 鍵進入群組後,他們應該能夠使用箭頭鍵更改群組內的選擇,然後按 Tab 退出群組並移至下一個欄位。這是 PDF 規範定義的標準鍵盤行為,並受到所有主要螢幕閱讀器的支援。在最終確定表單之前測試鍵盤導航流程。如果在單選組內按 Tab 鍵跳到下一個欄位而不是在單選選項之間移動,請檢查組內的單選按鈕是否共用完全相同的欄位名稱。

對於 WCAG 2.1 AA 級下的高對比度要求,請確保單選按鈕邊框顏色與頁面背景的對比度至少為 3:1。白色背景上的預設黑色邊框符合此要求,但灰色或有色表單背景上的自訂顏色邊框可能不符合此要求。在表單螢幕截圖上使用對比檢查工具,在分發之前驗證合規性。

正確匯出單選按鈕值

單選按鈕組將其選定的值匯出為表單資料匯出中的單一欄位。如果使用者從 PaymentMethod 群組中選擇 CreditCard,則匯出的 CSV 或 XML 記錄 PaymentMethod=CreditCard。使用的匯出值是您在欄位屬性中指派的按鈕值,而不是可見標籤。若要驗證匯出的資料中將顯示哪些值,請開啟一個測試表單,進行選擇,匯出數據,然後檢查這些值是否與資料庫或電子表格期望的值相符。

當單選按鈕選擇值包含空格、特殊字元或大小寫不一致時,會出現常見的資料整合問題。以camelCase 或snake_case 標準化選擇值,例如creditCard 或credit_card,而非Credit Card。一致的格式可防止 CSV 解析錯誤並使資料庫欄位驗證更簡單。在表單的設計說明中記錄按鈕值命名約定,以便日後維護表單的任何人都遵循相同的模式。

WukongPDF

嘗試編輯 PDF

無需安裝。直接在您的瀏覽器中工作。

立即開始 →