なぜjQueryのjQueryのdisabledプロパティは、最初の無線入力でのみ機能しますか？

Question

私は4つの入力を持っています。それらのうち2つを無効にし、jQueryを使用してチェックを外したいと思います。

私はそれも期待していますが、2番目はチェックされたプロパティを設定しますが、無効なプロパティは無視されるようです。

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と見なされるため、最初の動作になります。

---

それは私のために正常に動作します：

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

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

これはお勧めです、最良の結果を得るために、$(document).ready()関数を使用します。とにかくそれがとにかく働く理由は分かりませんその場合

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

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