如何在輸入元素隱藏時從複選框中刪除檢查？

我有一個複選框，可以通過下面的功能在選中時顯示附加選項。麻煩的是，如果顯示的複選框被選中，即使被隱藏，它們仍然被選中。我怎樣才能最好地綁定取消勾選與他們被隱藏相同的功能？如何在輸入元素隱藏時從複選框中刪除檢查？

這是許多類似隱藏取消隱藏分組之一。任何幫助表示讚賞！謝謝大家

請注意，我在一個系統中這樣做，我不能添加或更改任何HTML ID或類，這就是爲什麼有一大堆選定的項目。

$("input[id='form_0009_fld_5-0']").click(function() { 
    if($(this).is(':checked')) { 
     $("input[name='form_0009_fld_6-0'],label[for='form_0009_fld_6-0'],input[name='form_0009_fld_6-1'],label[for='form_0009_fld_6-1'],input[name='form_0009_fld_6-2'],label[for='form_0009_fld_6-2'],input[name='form_0009_fld_6-3'],label[for='form_0009_fld_6-3'],input[name='form_0009_fld_6-4'],label[for='form_0009_fld_6-4'],input[name='form_0009_fld_6-5'],label[for='form_0009_fld_6-5'],input[name='form_0009_fld_6-6'],label[for='form_0009_fld_6-6']").closest('.formField').show(); 
    } else { 
     $("input[name='form_0009_fld_6-0'],label[for='form_0009_fld_6-0'],input[name='form_0009_fld_6-1'],label[for='form_0009_fld_6-1'],input[name='form_0009_fld_6-2'],label[for='form_0009_fld_6-2'],input[name='form_0009_fld_6-3'],label[for='form_0009_fld_6-3'],input[name='form_0009_fld_6-4'],label[for='form_0009_fld_6-4'],input[name='form_0009_fld_6-5'],label[for='form_0009_fld_6-5'],input[name='form_0009_fld_6-6'],label[for='form_0009_fld_6-6']").closest('.formField').hide(); 
     } 
});

來源

2013-04-30 Jeremy Collins

解決此問題的更好方法是在代碼中包含「isHidden」檢查，而不是修改是否檢查某些內容？如果他們想讓複選框再次可見，這將保持用戶的選擇。 – Codeman 2013-04-30 19:24:24

另外，你可以給我們一個JSFiddle展示這個問題嗎？ – Codeman 2013-04-30 19:24:39

你可以使用jquery修改任何DOM元素，所以你仍然可以添加類來輸入你的目標，比使用無法讀取的選擇器更好 – 2013-04-30 19:26:57

Jquery允許您鏈接函數，以便您可以添加到hide的末尾。

例如：

$('longselector').closest('.formField').hide().attr("checked", false);

而且隨着你的代碼的其餘部分。

$("input[id='form_0009_fld_5-0']").click(function() { 
    if($(this).is(':checked')) { 
     $("input[name='form_0009_fld_6-0'],label[for='form_0009_fld_6-0'],input[name='form_0009_fld_6-1'],label[for='form_0009_fld_6-1'],input[name='form_0009_fld_6-2'],label[for='form_0009_fld_6-2'],input[name='form_0009_fld_6-3'],label[for='form_0009_fld_6-3'],input[name='form_0009_fld_6-4'],label[for='form_0009_fld_6-4'],input[name='form_0009_fld_6-5'],label[for='form_0009_fld_6-5'],input[name='form_0009_fld_6-6'],label[for='form_0009_fld_6-6']").closest('.formField').show(); 
    } else { 
     $("input[name='form_0009_fld_6-0'],label[for='form_0009_fld_6-0'],input[name='form_0009_fld_6-1'],label[for='form_0009_fld_6-1'],input[name='form_0009_fld_6-2'],label[for='form_0009_fld_6-2'],input[name='form_0009_fld_6-3'],label[for='form_0009_fld_6-3'],input[name='form_0009_fld_6-4'],label[for='form_0009_fld_6-4'],input[name='form_0009_fld_6-5'],label[for='form_0009_fld_6-5'],input[name='form_0009_fld_6-6'],label[for='form_0009_fld_6-6']").closest('.formField').hide().attr("checked", false); 
     } 
});

來源

2013-04-30 19:28:48

哦，男人，這讓我瘋狂。我發現這是我必須解決的鏈條順序（我認爲把attr（）放在最後就是將它應用到.closest（）也許？）。以下作品：'$（「selectors」）。prop（「checked」，false）.closest（'.formField'）。hide（）;' – 2013-05-01 22:57:08

屬性選擇器可以匹配「打頭」，「結尾」，和很多其他的選擇，所以沒有需要鍵入一堆像類似的選擇嗎？

要設置相應的複選框以「未登記」，你會使用prop('checked', false)如果最初切換不檢查等，並使用change事件的複選框，可能比一個click事件更好：

$("input[id^='form_0009_fld_5']").on('change', function() { 
    var elems = $('input[name^="form_0009_fld_6"]'), 
     state = this.checked; 

    elems.closest('.formField').toggle(state); 

    if (!state) elems.prop('checked', false); 
});

來源

2013-04-30 19:28:30 adeneo

如何在輸入元素隱藏時從複選框中刪除檢查？

回答

相關問題