Javascript 如何侦听此自定义bindingHandler中的数据更改？

我有一个自定义bindingHandler，在被单击时可以很好地工作。它成功地更改了数据点。。但当另一个ui控件更改数据时，它不会被更新

我的html看起来像这样

<input type="checkbox" data-bind="checked: publisher.my_check"> Checkbox
<div data-bind="slidebox: {label_on: 'ON', label_off: 'OFF', data: publisher.my_check }"></div>

ko.bindingHandlers.slidebox = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {


        var el = $(element),
            obj = valueAccessor();
        //add additional markup
        el.append($('<div>'));
        //set initial label
        el.find('div').text(el.hasClass('checked') ? obj.label_on : obj.label_off);
        //update the data point
        obj.data(el.hasClass('checked'));



        var updateHandler = function() {  
            console.log('i got clicked');   
            var el = $(element),
                obj = valueAccessor();
            el.toggleClass('checked').find('div').text(el.hasClass('checked') ? obj.label_on : obj.label_off);
            obj.data(el.hasClass('checked'));       

        };
        ko.utils.registerEventHandler(element, "click", updateHandler);

    },
    'update': function (element, valueAccessor) {
        console.log('i got updated');
    }
};

复选框

我的bindingHandler看起来像这样

<input type="checkbox" data-bind="checked: publisher.my_check"> Checkbox
<div data-bind="slidebox: {label_on: 'ON', label_off: 'OFF', data: publisher.my_check }"></div>

ko.bindingHandlers.slidebox = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {


        var el = $(element),
            obj = valueAccessor();
        //add additional markup
        el.append($('<div>'));
        //set initial label
        el.find('div').text(el.hasClass('checked') ? obj.label_on : obj.label_off);
        //update the data point
        obj.data(el.hasClass('checked'));



        var updateHandler = function() {  
            console.log('i got clicked');   
            var el = $(element),
                obj = valueAccessor();
            el.toggleClass('checked').find('div').text(el.hasClass('checked') ? obj.label_on : obj.label_off);
            obj.data(el.hasClass('checked'));       

        };
        ko.utils.registerEventHandler(element, "click", updateHandler);

    },
    'update': function (element, valueAccessor) {
        console.log('i got updated');
    }
};

ko.bindingHandlers.slidebox={
init：函数（元素、valueAccessor、allBindingsAccessor、viewModel）{
变量el=$（元素），
obj=值访问器（）；
//添加附加标记
el.追加（$（''）；
//设置初始标签
el.find（'div'）.text（el.hasClass（'checked'）？对象标签打开：对象标签关闭）；
//更新数据点
对象数据（el.HASSCLASS（‘已检查’）；
var updateHandler=函数（）{
log（“我被点击了”）；
变量el=$（元素），
obj=值访问器（）；
el.toggleClass（'checked'）.find（'div'）.text（el.hasClass（'checked'））？对象标签打开：对象标签关闭）；
对象数据（el.HASSCLASS（‘已检查’）；
};
元素“click”，updateHandler；
},
“更新”：函数（元素、valueAccessor）{
log（“我得到了更新”）；
}
};

---

单击div时，它会更改数据点，复选框会按预期更新。。但是，当单击复选框时，我没有看到实现更新功能所需的“我已更新”控制台消息。当数据绑定属性上绑定到的任何可观察对象被更新时，将调用此函数。在本例中，

publisher.my\u check

ko.bindingHandlers.slidebox = {
    init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
        ...
    },
    'update': function (element, valueAccessor) {
        var config = valueAccessor(),
            checked = ko.utils.unwrapObservable(config.data),
            $element = $(element).toggleClass('checked', checked);

        $element.find('div').text(checked ? config.label_on : config .label_off);           
    }
};

编辑

这里有一个工作代码的小提琴

---

希望这有帮助。

我的控制台日志是否至少应该触发？说明：日志在启动时触发，但在单击复选框Yes时不会触发。应该触发。我在一个JSFIDLE中运行了这个（请参见编辑），它运行得很好。没有看到你的出版商。我的检查代码，我不能帮助进一步。哇。。明白了。。只要一个console.log就不会启动。。你是对的，我确实需要实现更新代码。。。但是，只有一个console.log，就没有日志记录，也不知道发生了什么。这个版本有一个控制台日志，每次都会触发。