设置值时，复选框的可视状态不会更新

Question

我在下面的代码中遇到以下问题：

https://jsfiddle.net/ftnLv0pm/

我在android应用程序中的cordova.js上运行widget，我遇到一个问题，即view-standard-card-is-active-checkbox的可视状态未在widget中更新，而其数据在web上运行时更新（我已经检查了几次）。 有没有办法强制更新交换机的可视状态？或者我的代码中可能存在错误。

var cardEnabledCheckboxInput = $('#view-standard-card-is-active-checkbox');
var cardEnabledCheckbox = $('#view-standard-card-is-active-label');

if (currentCardData) {
            // This does not updates visual state, while has true inside
            cardEnabledCheckboxInput.prop('checked', currentCardData.enabled);

            // default card switch needs to be hidden if the card is disabled.
            if (!currentCardData.enabled) {
                hideDefaultCardSwitch();
            }
        }

该代码对视觉状态没有任何影响。

var currentCardData是包含有关卡的数据的json。

Answer 1

您似乎只是在更新数据。您还必须更新数据更改的视图。 如果您从另一个类执行此操作，请确保在UI线程上运行此命令。

Answer 2

＆＃13;

＆＃13;

var frameworkVersion = Registry.LocalMachine.OpenSubKey(@"SOFTWARE\Microsoft\NET Framework Setup\NDP\v4\Full", false)?.GetValue("Version");

＆＃13;

$('#view-standard-card-is-active-checkbox').prop('checked', true);

$(document).ready(function() {
    //set initial state.
    $('#view-standard-card-is-active-checkbox').val($(this).is(':checked'));

    $('#view-standard-card-is-active-checkbox').change(function() {
        $('#view-standard-card-is-active-checkbox').val($(this).is(':checked'));
    });

    $('#view-standard-card-is-active-checkbox').click(function() {
        if (!$(this).is(':checked')) {
            return confirm("Are you sure?");
        }else{
        	return confirm("checked");
        }
    });
});

＆＃13;

.view-standard-card-is-active-label {
    margin-top: 2%;
    float: right;
    position: relative;
    display: block;
    height: 10px;
    width: 50px;
    right: 6.9%;
    background: #d5d5d5;
    border-radius: 100px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.view-standard-card-is-active-label:after {
    margin-top: 2%;
    position: relative;
    left: -2px;
    top: -12px;
    display: block;
    width: 34px;
    height: 34px;
    border-radius: 100px;
    background: #777777;
    box-shadow: 0px 3px 3px rgba(0,0,0,0.05);
    content: '';
    transition: all 0.3s ease;
}

.view-standard-card-is-active-label:active:after { transform: scale(1.15, 0.85); }

#view-standard-card-is-active-checkbox:checked ~ .view-standard-card-is-active-label {
    background: #d5d5d5;
}

#view-standard-card-is-active-checkbox:checked ~ .view-standard-card-is-active-label:after {
    left: 20px;
    background: #ff0000;
}

#view-standard-card-is-active-checkbox:disabled ~ .view-standard-card-is-active-label {
    background: #F6F6F6;
    pointer-events: none;
}

#view-standard-card-is-active-checkbox:disabled ~ .view-standard-card-is-active-label:after { background: #bcbdbc; }

＆＃13;

＆＃13;

＆＃13;