Javascript禁止單選按鈕工作

Question

我認爲這很簡單，但我不明白爲什麼#type2不能被點擊。

<input type="radio" id="type1" name="group1" checked> 

<input type="radio" id="type2" name="group1"> 

<input type="text" class="type1"> 

<input type="text" class="type2" disabled> 

<script> 

function toggle() { 
    if ($('#type1').attr('checked', true)) { 
     $('.type1').attr('disabled', false); 
     $('.type2').attr('disabled', true); 
    } 
    else if ($('#type2').attr('checked', true)) { 
     $('.type1').attr('disabled', true); 
     $('.type2').attr('disabled', false); 
    } 
} 

$(document).ready(function() { 
    toggle(); 
}); 

</script> 

我看不出是什麼問題。任何幫助都會很棒，謝謝。

Answer 1

嘗試：

function toggle() { 
    if ($('#type1').is(':checked')) { 
     $('.type1').attr('disabled', false); 
     $('.type2').attr('disabled', true); 
    } 
    else if ($('#type2').is(':checked')) { 
     $('.type1').attr('disabled', true); 
     $('.type2').attr('disabled', false); 
    } 
} 

例子：http://jsfiddle.net/andrewwhitaker/z5Wbv/1/

的你使用.attr版本是設置#type1的checked屬性爲true。您可以使用is和:checked selector來確定是否選中了複選框/單選按鈕。

Answer 2

您正在使用.attr而不是.prop。

.attr是屬性，.prop是屬性。屬性=檢查，選擇，禁用。

文檔：http://api.jquery.com/prop/

要確定複選框被選中，

if (elem.checked) 
if ($(elem).prop("checked")) 
if ($(elem).is(":checked")) 

Answer 3

工作演示** http://jsfiddle.net/YUhFw/

，需要加以糾正很少有東西:)

• 檢查如果使用進行檢查
• 將其附加到單擊事件。
• 相應地附加和分離disabled屬性。

希望它適合事業:)

代碼

function toggle() { 
    if ($('#type1').is(':checked')) { 
     $('.type1').removeAttr('disabled'); 
     $('.type2').attr('disabled', true); 
    } 
    else if ($('#type2').is(':checked')) { 
     $('.type1').attr('disabled', true); 
     $('.type2').removeAttr('disabled'); 
    } 
} 

$(document).ready(function() { 
    $("input[type=radio]").click(function() { 
     toggle(); 
    }); 
});​ 

Answer 4

您沒有一個條件檢查這裏。

您是設置它which is always true .. 試試這個

if ($('#type1').is(':checked')){ 

還可以使用.prop()的.attr()代替，因爲這是真正的不是一個屬性，但一個單選按鈕的屬性。 您的代碼應該看起來像這樣

function toggle() { 
    if ($('#type1').is(':checked')) { 
     $('.type1').prop('disabled', false); 
     $('.type2').prop('disabled', true); 
    } 
    else if ($('#type2').is(':checked')) { 
     $('.type1').prop('disabled', true); 
     $('.type2').prop('disabled', false); 
    } 
}