部分選擇與javascript的複選框

有沒有一種方法使用JavaScript和HTML（5）使部分選中複選框，就像選擇只有一些子選項時程序安裝菜單中的複選框？部分選擇與javascript的複選框

來源

2011-06-07 AsherMaximum

你的確切意思是'部分選擇你會更清楚嗎？ – Devjosh 2011-06-07 17:39:36

@ kassens答案正是我所說的。部分選擇的意思就像在程序安裝菜單中，當你只選擇了一些子選項時，父選項複選框未被選中或未選中，但只是填充了實體，我將其描述爲部分選中。 – AsherMaximum 2011-06-07 18:16:55

HTML5 definesindeterminate布爾屬性。

我只在最新的Safari，Chrome和Firefox中測試過它。他們都支持不確定的狀態。

例子：http://jsfiddle.net/5tpXc/

編輯：注意用舊的瀏覽器這不會工作，也許不能與IE瀏覽器的最新版本。如果你想支持所有的瀏覽器，你需要依賴其他答案中描述的黑客。

來源

2011-06-07 17:49:18 kassens

不錯，我不知道！ – David 2011-06-07 17:50:42

我希望有一些HTML 5照顧了這一點，圖4 HTML4不會。這是一個我們將在內部使用的JavaScript程序，而且我的組織計算機管理策略強制每個人都使用firefox（但不要使用它，他們只需要擁有它）。無論哪種方式，它都是針對網絡部門的， m不擔心支持IE。謝謝您的幫助！ – AsherMaximum 2011-06-07 18:13:31

+10

順便說一下，我在IE9中打開了你的提琴，並且它正確顯示了不確定狀態 – AsherMaximum 2011-06-07 18:18:51

沒有。你將不得不做一個自定義複選框圖形和假。

編輯：請參閱@Kassen's answer以在符合HTML5的瀏覽器中部分檢查框。

來源

2011-06-07 17:38:40 BumbleB2na

對於現代瀏覽器，這是不正確的，請參閱[我的答案]（http://stackoverflow.com/questions/6269342/partially-select-checkbox-with-javascript/6269487#6269487）。 – kassens 2011-06-07 17:50:33

*吃自己的帽子* – BumbleB2na 2011-06-07 17:52:12

HTML複選框（即，input類型爲checkbox的元素）沒有第三個狀態（部分檢查）。所以不，沒有直接的方法來做到這一點。

您可能需要做的是製作自定義複選框外觀圖像並綁定到其各種事件（例如，單擊）以通過JavaScript將其當前「狀態」存儲在hidden表單字段中。不過，您可能會遇到這種方法的一些問題。

例如，表單的鍵盤導航可能不適用於此特定元素。（可以將一個標籤拖到圖像上併發送給它鍵盤事件嗎？我不確定）

此外，您可以嘗試通過JavaScript操作複選框元素上的自定義屬性以存儲第三個狀態。但是元素本身的渲染沒有像這樣的視覺指示器。你可以操縱它的風格（顏色，背景顏色，邊框顏色等）來模仿視覺行爲。但是，您可能無法實現您用作參考的精確視覺樣式。

這當然是一個有趣的前景，我很感興趣，我可能會嘗試在不久的將來實現這樣的事情。但是使用原生複選框元素，這是不可能的。它只有兩個州。

編輯：請參閱@kassens' answer在HTML5中這樣做。如果您出於任何原因限制到以前版本的HTML，那麼它將不得不像這裏所描述的那樣是黑客行爲。但是，如果您可以依賴支持HTML5的用戶，那麼它看起來像本機支持。

來源

2011-06-07 17:50:06 David

部分選擇與javascript的複選框

回答

相關問題