.prop對單選按鈕的行爲有所不同嗎？

Question

當我試圖使this fiddle與單選按鈕一起工作時，我無法使其工作。在閱讀了幾個答案後，我意識到我必須錯過一些非常明顯的東西。我試圖做到這一點，當我點擊收音機Others時，它應該啓用輸入表單。我在某處讀取了禁止輸入表單規則的地方required，這對我所要做的事情來說是完美的;也是我沒有試圖簡單地顯示/隱藏的原因。我很困惑，爲什麼選擇不正確。它clearly works for checkbox。這是片段：

$('#ctypeother').on('click', function() { 
 
    if ($(this).is(':checked')) { 
 
    $('#ctypeotherwhat').prop('readonly', true); 
 
    $('#ctypeotherwhat').prop('disabled', false); 
 
    //alert('checked'); 
 
    } else { 
 
    $('#ctypeotherwhat').prop('readonly', true); 
 
    $('#ctypeotherwhat').prop('disabled', true); 
 
    //alert('not checked'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="radio" name="ctype" value="A" /><label>A </label> 
 
<input type="radio" name="ctype" value="B" /><label>B </label> 
 
<input type="radio" name="ctype" value="C" /><label>C </label> 
 
<input type="radio" name="ctype" value="D" id="ctypeother" /> 
 
<label>Other </label> 
 
<input type="text" class="form-control" name="ctypeother" id="ctypeotherwhat" placeholder="Please Specify" />

Answer 1

的未檢查的事件沒有被正確觸發。相反，使用這樣的：

$('input[type="radio"]').on('click', function() { 
 
    if ($("#ctypeother").is(':checked')) { 
 
    $('#ctypeotherwhat').prop('disabled',false); 
 
    } else { 
 
    $('#ctypeotherwhat').prop('disabled',true); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="radio" name="ctype" value="A" /><label>A </label> 
 
<input type="radio" name="ctype" value="B" /><label>B </label> 
 
<input type="radio" name="ctype" value="C" /><label>C </label> 
 
<input type="radio" name="ctype" value="D" id="ctypeother" /> 
 
<label>Other </label> 
 
<input type="text" class="form-control" name="ctypeother" id="ctypeotherwhat" placeholder="Please Specify"/>