如何在JQuery中單擊最近元素（Checkbox）時禁用下一個元素（textarea）？

Question

單擊復選框，我希望下一個最近的文本區域被禁用。

以下是片段：

<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>

在Jquery：

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

Answer 1

單擊復選框，您可以使用closest()獲取父div ， next()查找下一個兄弟div ，然后使用find()獲取包含的textarea 。 嘗試這個：

 $(':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