Question

编辑3：在更多人拒绝投票之前，请注意这是不是重复的问题。

我正在一个需要一张满是复选框的桌面的网站上工作，每个网站都需要打开/关闭。有时切换一个需要关闭其他人等等。

我没有构建基本代码，但由于所有逻辑都很混乱，我决定做一些类似无线电的工作，所以我们只有一个基本功能来完成大部分逻辑工作。

我还有一个启用/禁用某些复选框的功能。这一切都很好，没有任何问题。

但是现在还有另一件事就是文字输入。如果在其中选择了某个值，则某些复选框会自动打开/关闭并锁定。使用相同的基本功能来执行此操作。但是当一个复选框被禁用时，然后重新启用时，以下函数将始终返回true 仅用于该复选框：

    $('input[type="checkbox"]').change(function() {

        // Make checkboxes with names work like radios (radios can't be toggled off)
        if ($(this).attr("name")) {
            // Save clicked toggle value
            var selected_toggle = $(this).attr('value');

            // disable all and then toggle clicked one on
            if ($('input[value="'+selected_toggle+'"]').prop("checked")) {
                console.log("This is checked");
                $('input:checkbox[name='+$(this).attr('name')+']').each(function() {
                    toggle_checkbox($(this).attr('value'), 'disabled');
                });
                toggle_checkbox(selected_toggle, 'enabled', 'on');
            }
            // Enable them all back if unchecking
            else {
                console.log("This is unchecked");
                $('input:checkbox[name='+$(this).attr('name')+']').each(function() {
                    toggle_checkbox($(this).attr('value'), 'enabled');
                });
                $(this).parent().toggleClass("on");
            }
        }
        else {
            // Toggle them on or off
            $(this).parent().toggleClass("on");
        }
    });

显而易见的是说＆＃34;在锁定/解锁该复选框时会出现一些不同的事情，但是它的功能和所有其他切换被禁用的方式相同，这是从toggle_checkbox函数：

function toggle_checkbox(toggle, value, on, lock) {

    // Disable the toggle completely
    if (value == 'disabled') {
        $('input[value="'+toggle+'"]').attr('disabled', 'disabled');
        $('input[value="'+toggle+'"]').parents('li').addClass('disabled');
        $('input[value="'+toggle+'"]').parent().removeClass('on');
        $('input[value="'+toggle+'"]').prop('checked', false);
    }
    // Enable a toggle back
    if (value == 'enabled') {
        $('input[value="'+toggle+'"]').parents('li').removeClass('disabled');

        // Turn it on
        if (on == 'on') {
            $('input[value="'+toggle+'"]').parent().addClass('on');
            $('input[value="'+toggle+'"]').prop('checked', true);
        }
        // Lock it on or remove disabled
        if (lock == 'lock') {
            $('input[value="'+toggle+'"]').attr('disabled', 'disabled');
        }
        else {
            $('input[value="'+toggle+'"]').removeAttr('disabled');
        }
    }
}

当我删除上面的名称属性代码时，该复选框工作正常。然而，每个其他复选框都正确地返回Checked / unchecked，当点击特定的未禁用复选框时，它总是返回＆＃34;这被检查＆＃34;。

之前我正在使用is（＆＃34;：checked＆＃34;），改为prop没有任何区别。

编辑：正如评论中所述，使用prop或attr并没有什么不同。这是锁定复选框的代码，卡住＆＃34;：

function set_hint_toggles(type, state) { 

    if (type == 'apples') { // Set when you select something with apples
        toggle_checkbox('pears', 'disabled');
        toggle_checkbox('apples', 'enabled', 'on', 'lock');
        toggle_checkbox('oranges', 'disabled');
    }
    if (state == 'off') { // This is set when a reset button is pressed
        var toggles_type = $('#hidden-input-with-value').val();
        toggle_checkbox(toggles_type, 'enabled'); // This checkbox gets stuck, all others continue working
        $('#text-input').removeAttr("disabled"); // Allows to type something again
    }
}

编辑2：在尝试马文回答后，我得到了一个略有不同的结果，可以帮助找出错误：

这个卡住的复选框有一个＆＃34;已检查＆＃34;并且＆＃34;禁用＆＃34;州。单击重置按钮时，将禁用禁用，但仍会检查（或应该）。当我在重置后尝试用上面的代码点击复选框时，就好像它被重新检查一次，然后一直坚持检查。

使用[0] .disabled = false，我可以继续打开和关闭复选框，但是没有激活js，并且每次点击仍然会返回选中状态。

编辑4：尝试使用时

toggle_checkbox(toggles_type, 'disabled');
toggle_checkbox(toggles_type, 'enabled');

在使复选框卡住的代码（上面的set_hint_toggles（off）函数）中，它仅被禁用。之后，此复选框始终返回false而不是始终为true。

Answer 1

Theres是一个小小的提示，你可以用它来改进你的代码..没有jsfiddle或一些例子，我担心我不能帮助你更多。您应该尝试使用DOM native api来设置禁用的项目

$('input[value="'+toggle+'"]')[0].disabled //returns if the element is disabled

$('input[value="'+toggle+'"]')[0].disabled  = true //set element as disabled or not

同样适用于checked属性。

$('input[value="'+toggle+'"]')[0].checked //returns if the element is checked

$('input[value="'+toggle+'"]')[0].checked = true //set element as checked or not

Answer 2

我发布的第一个代码块真的出了问题。我现在正在使用这个基于Adeneo关于改变选择器的建议而且它的工作完美：

// Search checkbox toggles
$('input[type="checkbox"]').change(function() {

    // Make checkboxes with names work like radios (radios can't be toggled off)
    if ($(this).attr("name")) {

        if (this.checked) {
            $('[name='+ this.name +']').each(function() {
                toggle_disabled( this.value, 'disabled');
            });
            toggle_disabled( this.value, 'enabled', 'on');
        }
        else {
            $('[name='+ this.name +']').each(function() {
                toggle_disabled( this.value, 'enabled');
            });
            $(this).parent().toggleClass("on");
        }
    }
    // Else if no name, just toggle on class
    else {
        $(this).parent().toggleClass("on");
    }
});

我认为问题出现在用于测试的选择器上，如果复选框已打开。

我现在也在其他一切上使用道具，但这并没有改变任何东西，似乎根本不会与问题有关。其他建议也没有做任何事情。

为什么复选框始终返回相同的值？

2 个答案: