如何通過再次單擊它來取消選中單選按鈕

Question

我一直在搜索很多主題，但我沒有發現任何與我的問題真正對應的內容：

我想要取消選中單選按鈕（例如，在已經選中時單擊它來取消選中單選按鈕）。

我找到了一些使用隱藏單選按鈕作為臨時比較對象的解決方案，但這不符合我現有的上下文，所以我想在沒有其他單選按鈕的情況下做同樣的事情。

我試着簡單地測試並改變“onclick”事件上單選按鈕的狀態/值，但它還不是很成功...

謝謝，克萊姆。

Answer 1

那不是單選按鈕。 如果您嘗試使這項工作，您只會混淆您的用戶。

如果您想要可以檢查然后取消選中的內容，請使用復選框。 單選按鈕用於選擇一組選項中的一個。

Answer 2

更好的是：

onclick="
var isChecked = $(this).attr('is_che');
if (isChecked) {
     $(this).removeAttr('checked');
     $(this).removeAttr('is_che');
}
else {
     $(this).attr('checked', 'checked');
     $(this).attr('is_che', 'true');
}"

Answer 3

我知道這種動作對於單選按鈕是非標准的，但是海報要求功能。 以下是我過去使用過的代碼。 我發現它不是最優化的（假設有大量的單選按鈕），但我還沒有花時間進行優化。

    //  Allow for radio button unchecking
$(function(){
    var allRadios = $('input[type=radio]')
    var radioChecked;

    var setCurrent = function(e) {
        var obj = e.target;
        radioChecked = $(obj).attr('checked');
    }

    var setCheck = function(e) {
        if (e.type == 'keypress' && e.charCode != 32) {
            return false;
        }
        var obj = e.target;
        if (radioChecked) {
            $(obj).attr('checked', false);
        } else {
            $(obj).attr('checked', true);
        }
    }

    $.each(allRadios, function(i, val) {
        var label = $('label[for=' + $(this).attr("id") + ']');
        $(this).bind('mousedown keydown', function(e){
            setCurrent(e);
        });

        label.bind('mousedown keydown', function(e){
            e.target = $('#' + $(this).attr("for"));
            setCurrent(e);
        });

        $(this).bind('click', function(e){
            setCheck(e);    
        });
    });
});