javascript - 禁用输入，直到选中复选框

Question

我有一个带有前置复选框的表单输入，我希望在选中该复选框之前禁用此输入。我该如何去做呢？

这是我的输入:

  <div class="form-group ">
                    <label class="control-label" for="date">Student</label>
                    <div class="input-group">
                      <span class="input-group-addon">
                        <input type="checkbox">
                      </span>
                      <input id="prependedcheckbox" name="prependedcheckbox" class="form-control"
                      type="text" placeholder="">
                    </div>
                  </div

This是我正在谈论的禁用状态的一个示例。

Answer 1

以下是使用 JQuery 的方法(记住在复选框中添加 id):

$(function() {
  $inp = $("#prependedcheckbox");
  $cb = $("#checkbox");
  $inp.prop('disabled', true);

  $cb.on('change', function() {
    if ($cb.is(':checked')) {
      $inp.prop('disabled', false);
    } else {
      $inp.prop('disabled', true);
    }
  });

});

JSFiddle