如何在JQuery中单击最近元素（Checkbox）时禁用下一个元素（textarea）？

Question

On click of Check box, i want the next nearest Text area to get disabled.

Following is snippet:

<div class="pure-u-1 pure-u-md-1-5">
  <input type="checkbox" value="true" class="fRegistrer" name="fRegistrer" id="fRegistrer">
</div>

<div class="pure-u-1 pure-u-md-1-5">
  <textarea cols="200" rows="5" class="normal" name="kommenter" id="kommenter"></textarea>
</div>

in Jquery:

 onclick="$(this).closest('.textnormal').find('textarea').attr('disabled',true)"

Answer 1

On click of the checkbox you can use closest() to get the parent div , next() to find the next sibling div , then find() to get the contained textarea . Try this:

 $(':checkbox').change(function() { $(this).closest('div').next('div').find('textarea').prop('disabled', !this.checked); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="pure-u-1 pure-u-md-1-5"> <input type="checkbox" value="true" class="fRegistrer" name="fRegistrer" id="fRegistrer"> </div> <div class="pure-u-1 pure-u-md-1-5"> <textarea cols="200" rows="5" class="normal" name="kommenter" id="kommenter" disabled="true">Foo bar</textarea> </div> 

Answer 2

$('#fRegistrer').click(function () {
    debugger
    $(this).parent('.pure-u-1').next().find('#kommenter').attr('disabled',true);
});  

DEMO