為什麼不能單選按鈕「readonly」？

問題描述

我想顯示一個單選按鈕，提交其值，但根據情況，不可編輯。禁用不起作用，因為它沒有提交值 (或是否)，並且會使單選按鈕變灰。 Read-only 真的是我正在尋找的，但由於一些神秘的原因，它不起作用。

有沒有一些奇怪的技巧，我需要拉 read-only 按預期工作？我應該用 JavaScript 代替嗎？

順便説一句，有沒有人知道為什麼 read-only 不能在單選按鈕中工作，而它在其他輸入標籤中工作？這是 HTML 規範中的這些難以理解的遺漏之一嗎？

最佳解決方案

如果有其他選項，單選按鈕只需要是 read-only 。如果您沒有任何其他選項，則無法取消選中選中的單選按鈕。如果您有其他選項，則可以通過禁用其他選項來阻止用户更改值：

<input type="radio" name="foo" value="Y" checked>
<input type="radio" name="foo" value="N" disabled>

小提琴：http://jsfiddle.net/qqVGu/

次佳解決方案

我已經通過禁用只有 un-checked 單選按鈕在單選按鈕上偽造了偽造。它使用户不選擇不同的值，並且檢查的值將始終在提交時發佈。

使用 jQuery 來做 readonly：

$(':radio:not(:checked)').attr('disabled', true);

這種方法也可以只讀一個選擇列表，除了你需要禁用每個 un-selected 選項。

第三種解決方案

這是你可以去的伎倆。

<input type="radio" name="name" onclick="this.checked = false;" />

第四種方案

我有一個冗長的表單 (250+字段) 發佈到一個數據庫。這是一個在線就業申請。當管理員查看已經提交的應用程序時，該表單將填充數據庫中的數據。輸入文本和文本區域被替換為它們提交的文本，但是收音機和複選框對於保留為表單元素是有用的。禁用它們使它們難以閲讀。將.checked 屬性設置為 false onclick 將無法正常工作，因為用户可能已填寫該應用程序。無論如何…

onclick="return false;"

工作像’disabling’ 收音機和複選框的魅力 ipso facto 。

第五種方案

設置已檢查或未檢查狀態 (來自客户端或服務器) 的最佳解決方案，並且不讓用户在病房之後進行更改 (也就是使其只讀)，請執行以下操作：

<input type="radio" name="name" onclick="javascript: return false;" />

參考文獻

Why can’t radio buttons be 「readonly」?

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。

為什麼不能單選按鈕「readonly」？