如何在knockout.js中向已经数据绑定的元素添加其他事件?

时间:2014-05-23 12:06:06

标签: javascript jquery knockout.js

我的日期控件看起来像这样。

<input data-bind="value: formatDateTime(ko.unwrap(Started)), css: { validationElement: validateItem(Started, 'Started') }, event: {
change: function(d, e) {
    if (Started != $(e)[0].target.value &amp;&amp; dateWheelShown == true) {
        $data.Started(dateToISO($(e)[0].target.value,'DD/MM/YYYY HH:mm'));
    }
}
}, id: 'Started' + '_' + Id()" data-onthemove_dateformat="DD/MM/YYYY HH:mm" class="Mobile_DateTimePick ui-input-text ui-body-c ui-corner-all ui-shadow-inset ui-mini" data-mini="true" name="Started" id="scoller1400844006695" readonly="">

对于其中一些日期控件,我需要在某些用户操作上添加其他事件   如何向已经数据绑定的元素注入其他事件?

1 个答案:

答案 0 :(得分:2)

您可以使用ko.applyBindingsToNode功能添加事件,例如

ko.applyBindingsToNode(input, { 
                           event: {
                               keydown : function() {
                                   alert("onKeydown")
                               }
                           }
                       })

JSFiddle DEMO *

* - 演示来源:
Html

<input id="inputId" data-bind="event: {
   change: function(d, e) {
       alert('onChange');
   }
}"/>
<button data-bind="click: addkeypressEvent">Add evend</button>

Javascript

var vm = {
    addkeypressEvent: function()
    {
        var input = document.getElementById("inputId");
        ko.applyBindingsToNode(input, { 
                                   event: {
                                       keydown : function() {
                                           alert("onKeydown")
                                       }
                                   }
                               })
   }
}
ko.applyBindings(vm)