为什么jQuery设置jQuery disabled属性只适用于第一个无线电输入？

Question

我有四个输入，我想使用jQuery禁用和取消选中其中两个。

第一个工作正如我所期望的那样，但是第二个设置了checked属性但似乎忽略了disabled属性。

jsfiddle：https://jsfiddle.net/ov5uow38/

HTML：

<div class="selectedTime">
  <label class="radio"><input type="radio" value="08:30 - 12:00" name="f_fitting_time" class="time_1" checked="checked" disabled="">08:30 - 12:00</label>
  <div class="nonSat">
    <label class="radio">
    <input type="radio" value="10:00 - 13:30" name="f_fitting_time" class="time_2">
    10:00 - 13:30
    </label>
    <label class="radio">
    <input type="radio" value="11:30 - 15:00" name="f_fitting_time" class="time_3">
      11:30 - 15:00
    </label>
    <label class="radio">
    <input type="radio" value="13:30 - 17:30" name="f_fitting_time" class="time_4">
      13:30 - 17:30
    </label>
  </div>
</div>

Jquery代码：

$('.time_1').prop('disabled', true);
$('.time_1').prop('checked',false);
$('.time_2').prop('disabled', true);
$('.time_2').prop('checked',false);

Answer 1

<强>更新

在你的jsFiddle中，你不包括jQuery库。在这里更新了jQuery： https://jsfiddle.net/ov5uow38/2/ 。

适用于第一个，因为$被视为Console Functions。

它适用于我：

＆＃13;

＆＃13;

$('.time_1').prop('disabled', true);
$('.time_1').prop('checked',false);
$('.time_2').prop('disabled', true);
$('.time_2').prop('checked',false);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="selectedTime">
  <label class="radio"><input type="radio" value="08:30 - 12:00" name="f_fitting_time" class="time_1" checked="checked" disabled="">08:30 - 12:00</label>
  <div class="nonSat">
    <label class="radio">
      <input type="radio" value="10:00 - 13:30" name="f_fitting_time" class="time_2">
      10:00 - 13:30
    </label>
    <label class="radio">
      <input type="radio" value="11:30 - 15:00" name="f_fitting_time" class="time_3">
      11:30 - 15:00
    </label>
    <label class="radio">
      <input type="radio" value="13:30 - 17:30" name="f_fitting_time" class="time_4">
      13:30 - 17:30
    </label>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

建议，为了获得最佳效果，请使用$(document).ready()功能。不知道它为什么会起作用。

＆＃13;

＆＃13;

$(function () {
  $('.time_1').prop('disabled', true);
  $('.time_1').prop('checked',false);
  $('.time_2').prop('disabled', true);
  $('.time_2').prop('checked',false);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="selectedTime">
  <label class="radio"><input type="radio" value="08:30 - 12:00" name="f_fitting_time" class="time_1" checked="checked" disabled="">08:30 - 12:00</label>
  <div class="nonSat">
    <label class="radio">
      <input type="radio" value="10:00 - 13:30" name="f_fitting_time" class="time_2">
      10:00 - 13:30
    </label>
    <label class="radio">
      <input type="radio" value="11:30 - 15:00" name="f_fitting_time" class="time_3">
      11:30 - 15:00
    </label>
    <label class="radio">
      <input type="radio" value="13:30 - 17:30" name="f_fitting_time" class="time_4">
      13:30 - 17:30
    </label>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;