Question

我想使用单选按钮禁用我的部分div，单选按钮应禁用并启用div以适应radion按钮。我希望它仍然显示，但你不能输入或更改输入框

这是div的代码

<div class="form-group">
  <label for="name" class="col-sm-2 text-left"> Apakah Penerima KPS / PKH
  </label>
  <div class="col-sm-10 radio text-left">
      <label>
          <input type="radio" value="Ya" class="radio_penerima_kps" name="radio_penerima_kps" id="penerima_kps_ya">
          Ya
      </label>
      &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
      <label>
          <input type="radio" value="Tidak" class="radio_penerima_kps" name="radio_penerima_kps" id="penerima_kps_tidak" >
          Tidak
      </label>
  </div>
</div>
<div id="form_kps">
     <div class="form-group">
      <label for="name" class="col-sm-2 text-left">No. KPS / PKH
      </label>
      <div class="col-sm-5">
        <input type="text" class="form-control"  placeholder="" id="nomor_kps_pkh" name="nomor_kps_pkh" value="<?=@$registration->nomor_kps_pkh?>"  onchange="update_data()">
      </div>
    </div>
    <div class="form-group">
      <label for="name" class="col-sm-2 text-left">Usulan dari sekolah layak PIP
      </label>
      <div class="col-sm-5">
        <input type="text" class="form-control"  placeholder="" id="usulan_sekolah_layak_pip" name="usulan_sekolah_layak_pip" value="<?=@$registration->usulan_sekolah_layak_pip?>"  onchange="update_data()">
      </div>
    </div>
    <div class="form-group">
      <label for="name" class="col-sm-2 text-left">Alasan Layak
      </label>
      <div class="col-sm-5">
        <input type="text" class="form-control"  placeholder="" id="alasan_layak" name="alasan_layak" value="<?=@$registration->alasan_layak?>"  onchange="update_data()">
      </div>
    </div>
</div>

这是我正在使用的javascript代码。

$(".radio_penerima_kps").click(function () {
    if($(this).val() == "Ya"){
       $("#nomor_kps_pkh").prop("disabled", false);
       $("#usulan_sekolah_layak_pip").prop("disabled", false);
       $("#alasan_layak").prop("disabled", false);
    }else{
      $("#nomor_kps_pkh").prop("disabled", true);
       $("#usulan_sekolah_layak_pip").prop("disabled", true);
       $("#alasan_layak").prop("disabled", true);
    }
});

Answer 1

如果情况失败，请更改div样式。 div不能启用或禁用，只能输入

 $("#form_kps").css('background', "#ccc")

Answer 2

您可以使用以下方法更改与div关联的输入：

$(".radio_penerima_kps").click(function () {
if($(this).val() == "Ya"){
    $('#form_kps .form-control').prop("disabled", false);

}else{
  $('#form_kps .form-control').prop("disabled", true);

}

}）;

因此，您基本上使用div的id和与之关联的类来更改输入的值。无法启用/禁用div。

使用单选按钮禁用div

2 个答案: