基因敲除及其绑定

Question

我有两个复选框，我希望这两个复选框的值相互依赖。当我选中第一个复选框时，第二个复选框被取消选中，当我取消选中第一个复选框时，第二个复选框被选中，反之亦然。我可以用jQuery：example做到这一点。

$('input').on('change', 
     function() {         
         var anotherId = $(this).attr('id') == 'first' ? 'second' : 'first';        
         if($(this).is(':checked'))
             $('[id="' + anotherId + '"]').removeAttr('checked');
         else 
             $('[id="' + anotherId + '"]').attr('checked', 'true');
     });

但我认为这不是最好的方式。我知道我可以用knockout.js做到这一点，但我不知道怎么做到。你能帮我解决这个问题吗？

Answer 1

您是否考虑过使用单选按钮？;-)

你没有给出太多的实际背景；有很多方法可以解决这个问题，哪种方法最好取决于具体情况。无论如何，这里有一种方法可以做到这一点。

为该值创建“私有”可观测对象，并让“公共”计算可观测对象在write位内具有一些额外的逻辑(类似于C#中具有复杂设置器的属性)：

var ViewModel = function() {
    var self = this;

    var _first = ko.observable(true);
    var _second = ko.observable(false);

    self.first = ko.computed({
        read: _first,
        write: function(val) {
            _first(val);
            _second(!val);
        }});

    self.second = ko.computed({
        read: _second,
        write: function(val) {
            _second(val);
            _first(!val);
        }});
};

ko.applyBindings(new ViewModel());

查看this fiddle中的工作演示。同样，请注意复选框现在的行为就像它们是单选按钮一样……