Jquery切換多塊複選框

我有這個工作，但有一個輕微的問題...Jquery切換多塊複選框

我有2塊3複選框。組A和組B

如果我爲組A選擇'全部'，則切換組A中的所有複選框狀態。

如果我然後爲B組選擇'全部'，那麼我必須點擊兩次B組複選框的狀態才能更改。

這是JQuery的我使用：

var checked = false;  
$('.all').click(function() { 
    e = $(this).attr('name'); 
    checked = !checked; 
    $('input[class=' + e).prop('checked', checked); 
});

我創建了一個小提琴例如http://jsfiddle.net/1kgneajL/

爲什麼我不得不從B組點擊兩次？我計劃增加更多的小組，所以我需要確保這種情況不會變得更糟。如果我有10組，會發生什麼？

任何方式來解決這個問題？

感謝

來源

2014-10-22 Rocket

正因爲如此：

var checked = false;

兩個組都使用相同的變量......所以，當你設定A組爲假，當你點擊在B組，這將是錯誤的以及..即使所有盒B組檢查

存儲在組方面，小組檢查了一個quickfix：

$('.all').click(function() { 
     e = $(this).attr('name'); 

     checked = $(this).attr('checked'); 
     checked = !checked; 
     $(this).attr('checked', checked); 

     $('input[class=' + e + ']').prop('checked', checked); 
    });

無需checked變量了

來源

2014-10-22 11:35:18

感謝這工作很好:) – Rocket 2014-10-22 11:46:36

其因全球

var checked = false;

它適用於這兩個組。你應該檢查了GroupeA和checkedGroupB。

來源

2014-10-22 11:34:32

因此，如果您需要創建組C，您還需要創建checkedGroupC變量？不是理想的，代碼應該更具適應性。 – 2014-10-22 11:48:50

here已修改您的演示。您應該爲每個分開的組保存已選狀態。

var checked = {A:false, B:false};  
$('.all').click(function() { 
    e = $(this).attr('name'); 
    checked[e] = !checked[e]; 
    $('.' + e).prop('checked', checked[e]); 
});

來源

2014-10-22 11:35:37 aleha

我需要列出每個組'var checked ='？所以如果我有10個組合，那將是一條很長的路線。 – Rocket 2014-10-22 11:44:36

@Rocket是正確的，如果你創建了「C組」，「D組」等，也是行不通的。只要你的應用程序增長，你就需要維護這些代碼，這不是理想之選。檢查我的答案，找出不需要維護的代碼，並將每個組上下文存儲在組對象中。 – 2014-10-22 11:44:50

Jquery切換多塊複選框

回答

相關問題