如果选中则禁用表格答案

【问题标题】：If checked then disabled form如果选中则禁用表格
【发布时间】：2016-04-08 13:29:46
【问题描述】：

我有这些代码：

<div class="nested-fields">
  <div class="row">
    <div class="col-sm-4">
      <div class="form-group">
        <%= f.input :start_work, as: :date, start_year: Date.today.year - 20,
                                            end_year: Date.today.year, ignore_day: true,
                                            order: [:month, :year],
                                            input_html: { class: 'form-control' },
                                            label: 'Start work period' %>
      </div>

      <div class="form-group">
        <%= f.input :is_current, label: 'Currently work here', input_html: { class: 'current' } %>
      </div>
    </div>

    <div class="col-sm-4">
      <div class="form-group">
        <%= f.input :end_work, input_html: {class: 'end_work'}, as: :date, start_year: Date.today.year - 20,
                                            end_year: Date.today.year, ignore_day: true,
                                            order: [:month, :year],
                                            input_html: { class: 'form-control' },
                                            label: 'End work period' %>
      </div>
    </div>
  </div>
</div>

<script>
  $(document).ready(function() {
    // experience current work
    $(".current").each(function() {
      $(this).click(function() {
        var isCurrent = $(this).prop("checked");
        if (isCurrent == true) {
          $(this).closest('.form-group').next('.form-group').find('.end_work').prop("disabled", "disabled");
        }
        else {
          $(this).closest('.form-group').next('.form-group').find('.end_work').prop("disabled", false);
        }
      });
    });
  });
</script>

但是，当当前框检查时，我无法禁用我的End_work输入。我想我错过了目标类或 Javascript 上的东西。任何帮助都会很棒！

【问题讨论】：

标签： javascript ruby-on-rails forms simple-form

【解决方案1】：

$(this).closest('.form-group').next('.form-group') 不会做你认为的那样。 div.form-groups 不是 DOM 中的兄弟姐妹，所以，如果我没记错的话，.next('.form-group') 将找不到任何东西。

试试$(this).closest('.col-sm-4').next('.col-sm-4').find('.end_work')。

顺便说一句，这段代码是多余的：

$(".current").each(function() {
  $(this).click(function() {
    ...

... 因为.click 已经为选择器匹配的每个元素附加了一个点击处理程序。你可以用一行代码完成同样的事情：

$(".current").click(function() {
  ...

【讨论】：