如何在jquery中选中复选框时禁用文本框

时间:2014-09-30 07:12:34

标签: jquery

我有这样的复选框数组和2组文本框数组。

//CHECKBOXES
<div class="checkbox">
<input type="checkbox" value="male" name="sex[0]">
<input type="checkbox" value="female" name="sex[1]">
<input type="checkbox" value="others" name="sex[2]">
</div>

//TEXTBOXES1
<input type="text" name="numberofheads[0]" disabled="true">
<input type="text" name="numberofheads[1]" disabled="true">
<input type="text" name="numberofheads[2]" disabled="true">

//TEXTBOXES2
<input type="text" name="average[0]" disabled="true">
<input type="text" name="average[1]" disabled="true">
<input type="text" name="average[2]" disabled="true">

如果我检查男性,则会启用所有包含0键的文本框,如果未选中,则会再次禁用该文本框。是否可以在jquery中执行此操作?如果它确实请帮帮我..谢谢!

2 个答案:

答案 0 :(得分:2)

把它http://jsfiddle.net/df6qjf2j/

$(function() {
    $('[type="checkbox"]').on('change', function() {
        var isChecked = $(this).is(':checked');
        var number = $(this).index();
        $('[name="numberofheads[' + number + ']"]').attr('disabled', !isChecked);
        $('[name="average[' + number + ']"]').attr('disabled', !isChecked);
    });
});

答案 1 :(得分:0)

试试这个:

 //or $("input[type='checkbox']") use this 

$('[name="sex[0]"],[name="sex[1]"],[name="sex[2]"]').click(function(){
        var numberval = $(this).index();

 if($(this).is(':checked'))
  { 

  $("input[name='average["+numberval+"]'],input[name='numberofheads["+numberval+"]']").removeAttr('disabled');

   }   

  else
  {
          $("input[name='numberofheads["+numberval+"]'],input[name='average["+numberval+"]']").attr('disabled',true);

   }

  });

http://jsfiddle.net/1wc6wwr8/2/