如何为1个已启用的文本框添加多个复选框

时间:2017-08-31 06:56:43

标签: javascript jquery

  

我想如果未检查cuti tahunan然后文本框没有显示在cuti khusus dan cuti sakit



 

    $('#cutiKhusus').change(function(){
        $("#textCutiKhusus").prop("disabled", !$(this).is(':checked'));
    });
    $('#cutiSakit').change(function(){
        $("#textCutiSakit").prop("disabled", !$(this).is(':checked'));
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <div class="form-group">
	<label for="inputPassword3" class="col-sm-4 control-label">Jenis Cuti</label>
	    <div class="col-sm-8">
                <div class="checkbox">
                    <label>
                        <input id="cutitahunan"  type="checkbox" id="" name="C_CUTI_TAHUNAN" value="Y"/>
                            Cuti Tahunan
                    </label>
                </div>

                <div class="checkbox">
                     <label>
                         <input type="checkbox" id="cutiSakit" name="C_CUTI_SAKIT" value="Y"/>
                             Cuti Sakit
                         <input id="textCutiSakit" type="number" data-tt='tooltip' data-placement='top' title='Isikan jumlah hari 'required name="I_JML_SAKIT" class=""  style="width: 50px;" disabled >
                             Hari
                     </label>
                </div>

                <div class="checkbox">
                     <label>
                         <input type="checkbox" id="cutiKhusus" name="C_CUTI_KHUSUS" value="Y"/>
                             Cuti Khusus
                     </label>
                     <input id="textCutiKhusus" type="number" data-tt='tooltip' data-placement='top' title='Isikan jumlah hari ' required name="I_JML_KHUSUS" class=""  style="width: 50px;" disabled >
                             Hari
                </div>
							
           </div>
    </div>
&#13;
&#13;
&#13;

我该如何解决这个问题?

  

fdasfadfasfasdf fads fads fads fa fasd fasd fasdf

1 个答案:

答案 0 :(得分:0)

尝试以下代码。

&#13;
&#13;
 $('#cutitahunan').change(function() {
     if ($(this).is(':checked')) {
         $('.text').removeClass('hide');
     } else {
         $('.text').addClass('hide');
     }
 })


 $('#cutiKhusus').change(function() {
     $("#textCutiKhusus").prop("disabled", !$(this).is(':checked'));
 });
 $('#cutiSakit').change(function() {
     $("#textCutiSakit").prop("disabled", !$(this).is(':checked'));
 });
&#13;
.hide{
display:none;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <div class="form-group">
	<label for="inputPassword3" class="col-sm-4 control-label">Jenis Cuti</label>
	    <div class="col-sm-8">
                <div class="checkbox">
                    <label>
                        <input id="cutitahunan"  type="checkbox" id="" name="C_CUTI_TAHUNAN" value="Y"/>
                            Cuti Tahunan
                    </label>
                </div>

                <div class="checkbox">
                     <label>
                         <input type="checkbox" id="cutiSakit" name="C_CUTI_SAKIT" value="Y"/>
                             Cuti Sakit
                         <input id="textCutiSakit" type="number" data-tt='tooltip' data-placement='top' title='Isikan jumlah hari 'required name="I_JML_SAKIT" class="hide text"  style="width: 50px;" disabled >
                             Hari
                     </label>
                </div>

                <div class="checkbox">
                     <label>
                         <input type="checkbox" id="cutiKhusus" name="C_CUTI_KHUSUS" value="Y"/>
                             Cuti Khusus
                     </label>
                     <input id="textCutiKhusus" type="number" data-tt='tooltip' data-placement='top' title='Isikan jumlah hari ' required name="I_JML_KHUSUS" class="hide text"  style="width: 50px;" disabled >
                             Hari
                </div>
							
           </div>
    </div>
&#13;
&#13;
&#13;