Jak włączyć grupę radiową za pomocą pola wyboru?

Question

Przeszukałem wszystko, ale nadal nie mogę tego naprawić. Proszę o pomoc:

Oto mój kod JS:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#email_acc").click(function() { 
      if ($(this).is(":checked")) { 
       $("#email_group").attr("enabled","enabled"); 
      } 
     }); 

     $("#system_acc").click(function() { 
      if ($(this).is(":checked")) { 
       $("#system_group").attr("enabled","enabled"); 
      } 
     }); 
    }); 
</script> 

Poniżej przedstawiono mojego kodu HTML:

<input type="checkbox" name="email_acc" id="email_acc" />Email Account 
<input type="checkbox" name="sys_acc" id="sys_acc" />System Account 

<input type="radio" name="radio_email" value="create" class="email_group" id="radio_email_0" disabled="disabled"/>New 
<input type="radio" name="radio_email" value="change" id="radio_email_1" disabled="disabled"/>Change 
<input type="radio" name="radio_email" value="terminate" id="radio_email_2" disabled="disabled"\ />Termination 

<input type="radio" name="radio_system" value="create" class="system_group" id="radio_system_0" disabled="disabled"/>New 
<input type="radio" name="radio_system" value="change" id="radio_system_1" disabled="disabled" />Change 
<input type="radio" name="radio_system" value="terminate" id="radio_system_2" disabled="disabled" />Termination 

I donno co jest problem.It po prostu nie działa.

Answer 1

Nie ma atrybutu ani właściwości "enabled", tylko atrybut lub właściwość "disabled", którą można ustawić na false, aby włączyć dany element (elementy). ("Atrybut" znajduje się w źródłowym html, ale zmiany dynamiczne są wprowadzane do "właściwości", ustawiając ją na wartość boolowską, aby ją wyłączyć.)

Jeśli nie używasz starej wersji jQuery, powinieneś użyć .prop() method, aby zaktualizować tę właściwość. Aby włączyć całą grupę przycisków radiowych, musisz zaznaczyć je wszystkie za pomocą ich atrybutu name (lub nadać im wspólny class i wybrać przez to).

$("#email_acc").click(function() { 
    if (this.checked) { 
     $('input[name="radio_email"]').prop('disabled', false); 
    } 
}); 

// and the same for the other checkbox and group. 

pamiętać, że drugie pole ma id="sys_acc" ale twój JS próbuje wybrać z "#system_acc" - trzeba upewnić się, że pasują do siebie.

Jeśli trzeba ponownie wyłączyć grupy, jeśli pole wyboru jest zaznaczone, a następnie można wykonać następujące czynności, usuwając oświadczenie if i ustawienie właściwości disabled do odwrotności własności checked:

$('#email_acc').click(function() { 
    $('input[name="radio_email"]').prop('disabled', !this.checked); 
}); 

// and again the same idea for the other checkbox and group. 

Demo: http://jsfiddle.net/UqTB3/

Należy zauważyć, że w obu przypadkach Użyłem this.checked zamiast $(this).is(":checked"): Uważam, że były łatwiejsze do czytania, i to jest bardziej wydajny w celu sprawdzenia elementu DOM za checked się bezpośrednio niż utwórz obiekt jQuery i użyj .is(":checked"). Ale jeśli naprawdę chcesz używać jQuery do , wszystko, co możesz zrobić, możesz dokonać odpowiedniego zamiany.

Answer 2

$("#email_acc").click(function() 
    { 
     if ($(this).is(":checked")) 
     { 
      $("#email_group").attr("disabled","false"); 
        or 
      $("#email_group").attr("disabled",false); 
     } 
    }); 

Answer 3

$(document).ready(function() 
{ 

    $("#email_acc").click(function() 
    { 
     if ($(this).is(":checked")) 
     { 
      $("input[name='radio_email']").removeAttr("disabled"); 
      //  ^----------------enable all the checkbox with common name 
     } 
    }); 

    $("#sys_acc").click(function() 
    //  ^---------corrected id 
    { 
     if ($(this).is(":checked")) 
     { $("input[name='radio_system']").removeAttr("disabled"); 
     //   ^----------------enable all the checkbox with common name 
     } 
    }); 
});​ 

DEMO

DEMO 2

Kod zaktualizowane do nowych wymogów wynikających z OP, oczyszczone kod dzięki NNNNNN

AKTUALIZACJADEMO 3

Answer 4

1. Dodaj nazwę w html wejściowego

2. nazwa powinna być taka sama

   <script type="text/javascript"> 
       document.getElementById('cek3').onchange = function() { 
        document.getElementById('fasilitas_kost1').disabled = !this.checked; 
        document.getElementById('fasilitas_kost2').disabled = !this.checked; 
        document.getElementById('fasilitas_kost3').disabled = !this.checked; 
        document.getElementById('fasilitas_kost4').disabled = !this.checked; 
        document.getElementById('fasilitas_kost5').disabled = !this.checked; 
        document.getElementById('fasilitas_kost6').disabled = !this.checked; 
        document.getElementById('fasilitas_kost7').disabled = !this.checked; 
       }; 
   </script>