选中复选框时启用/禁用输入

时间:2019-04-05 13:05:40

标签: javascript jquery html

所以我有一个复选框和一个“输入数字”,我想在使用jquery选中/取消选中该复选框时启用/禁用该输入!

代码如下:

 $(document).ready(function() { 
      $("#criar").click(function() {
        $('input[name^="quant"]').each(function() {
          $(this).attr('disabled', 'disabled');
  });
  $('#myform').change(function(){
        var i=0;
        $('input[name^="tipo"]').each(function() {
          if($(this).prop('checked')){
            $('#textnumber').eq(i).prop('disabled', false);
          }else{                                         
            $('#textnumber').eq(i).prop('disabled',true);
          }
           i++;
      });
    });
  });
}); 

以及html代码:

<input type="checkbox" name="tipo[]" id="tipo">
<input type="number" name="quant[]" min="1" max="50" id="textnumber[]">

这是有效的,但只有第一个复选框和输入有效,如您所见here

1 个答案:

答案 0 :(得分:1)

使用“ .is(':checked')”来检查是否选中了选择框。希望这会有所帮助,我认为这就是您想要的

$(document).ready(function() { 
  $('.number').prop('disabled', true);
  $('#tipo').click(function(){
  if($(this).is(':checked'))
  {
        $('.number').prop('disabled', false);
  }
  else
        $('.number').prop('disabled', true);
      })

 });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" name="tipo[]" id="tipo">
<input type="number" name="quant[]" min="1" max="50" id="textnumber[]" class="number">