Knockout中实现按键时触发change事件的问题

方法一：添加valueUpdate绑定选项 #

直接在输入框的data-bind里加上valueUpdate: 'input'（推荐用input事件，比keyup更全面，能覆盖粘贴、拖拽输入等场景），让Knockout在输入内容变化时立刻更新observable：

<input class="form-control" type="text" 
       data-bind="inputmask: { value: homePhone, mask: selectedHomePhoneFormat }, 
                  valueUpdate: 'input'"/>

加了这个配置后，每次按键、粘贴操作触发输入事件时，homePhone就会实时更新，订阅的回调函数也就会立即执行。

方法二：用inputmask的事件回调手动同步 #

如果方法一没效果，就在inputmask的配置里加onInput回调，手动把输入框的值同步到observable：

<input class="form-control" type="text" 
       data-bind="inputmask: { 
                   value: homePhone, 
                   mask: selectedHomePhoneFormat,
                   onInput: function() {
                     homePhone($(this).val());
                   }
                 }"/>

借助inputmask的onInput事件，每次输入时直接更新homePhone，保证订阅能实时触发。

方法三：配合autoUnmask配置（按需使用） #

如果需要获取未被掩码格式化的原始值，可以开启autoUnmask选项，同时保留valueUpdate配置：

<input class="form-control" type="text" 
       data-bind="inputmask: { 
                   value: homePhone, 
                   mask: selectedHomePhoneFormat,
                   autoUnmask: true
                 },
                 valueUpdate: 'input'"/>

这样设置后，homePhone拿到的是原始输入值，同时每次输入都会实时触发订阅回调。

内容的提问来源于stack exchange，提问作者Neu