我只需要禁用提交表单后选中的复选框：

Question

这是我的 HTML 代码：

其实我有更多的复选框被设计成按钮来选择房间（由复选框表示），所以所有这些都被选中非常烦人。

$("form").submit(function() {
  $('.seat input:checkbox').prop("disabled", true);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<form name="qwer" action="/" method="post">
  <ol class="block1">
    <li class="row row--1">
      <ol class="seats" type="A">
        <li class="seat">
          <input type="checkbox" id="1A" />
          <label for="1A">1A</label>
        </li>
        <li class="seat">
          <input type="checkbox" id="1B" />
          <label for="1B">1B</label>
        </li>
        <li class="seat">
          <input type="checkbox" id="1C" />
          <label for="1C">1C</label>
        </li>
        <input type="submit" value="Register" />
</form>

在我选中选中的复选框并提交表单后，所有其他复选框也会被禁用。

Answer 1

您还必须添加 :checked 才能仅禁用选中的复选框。

$("form").submit(function() {
  $('.seat input:checkbox:checked').prop("disabled", true); //Change here
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<form name="qwer" action="/" method="post">
  <ol class="block1">
    <li class="row row--1">
      <ol class="seats" type="A">
        <li class="seat">
          <input type="checkbox" id="1A" />
          <label for="1A">1A</label>
        </li>
        <li class="seat">
          <input type="checkbox" id="1B" />
          <label for="1B">1B</label>
        </li>
        <li class="seat">
          <input type="checkbox" id="1C" />
          <label for="1C">1C</label>
        </li>
        <input type="submit" value="Register" />
</form>