Knockout textInput 和 maskedinput 插件
Knockout textInput and maskedinput plugin
有没有简单的方法来使用 data-bind="textInput: aProperty"
并在用户键入时添加输入掩码或一些自动格式设置 ?
使用 masked input 插件可以工作,但我丢失了 Knockout 的 "textInput:" 提供的 "as-you-type" 更新,因此脚本的其他部分只能在字段丢失后看到更改焦点(在 Knockout 中有效地表现为一个普通的旧 "value:" 绑定)。
使用计算可观察对象进行格式化的天真的解决方案不起作用,因为每次击键更新自身的字段都会将输入焦点更改到页面中的其他位置,因此用户无法继续输入。
我可以让这两个库相互配合,还是应该定制我的解决方案?他们在事件处理程序中做了很多事情以与所有浏览器兼容,因此很难让它们一起工作也就不足为奇了,但这也是我不想 fiddle 与所有浏览器一起工作的原因那些按键,输入,更改,我自己的事件。
Whosebug 上的所有先前答案都不介意仅在字段失去焦点后传播更改。也许这些答案是在将 textInput 添加到 Knockout 之前发布的,所以当时没有更好的东西。这就是为什么我要问一个新问题。
我写了一个 fiddle,它只使用一个计算的可观察对象,而且我没有焦点问题。这是否如您所愿?
var displayString = ko.observable('');
var formattedString = ko.computed({
read: function () {
return displayString();
},
write: function (newValue) {
var f = format(newValue);
console.debug("Format", newValue, "=", f);
displayString(f);
}
});
有没有简单的方法来使用 data-bind="textInput: aProperty"
并在用户键入时添加输入掩码或一些自动格式设置 ?
使用 masked input 插件可以工作,但我丢失了 Knockout 的 "textInput:" 提供的 "as-you-type" 更新,因此脚本的其他部分只能在字段丢失后看到更改焦点(在 Knockout 中有效地表现为一个普通的旧 "value:" 绑定)。
使用计算可观察对象进行格式化的天真的解决方案不起作用,因为每次击键更新自身的字段都会将输入焦点更改到页面中的其他位置,因此用户无法继续输入。
我可以让这两个库相互配合,还是应该定制我的解决方案?他们在事件处理程序中做了很多事情以与所有浏览器兼容,因此很难让它们一起工作也就不足为奇了,但这也是我不想 fiddle 与所有浏览器一起工作的原因那些按键,输入,更改,我自己的事件。
Whosebug 上的所有先前答案都不介意仅在字段失去焦点后传播更改。也许这些答案是在将 textInput 添加到 Knockout 之前发布的,所以当时没有更好的东西。这就是为什么我要问一个新问题。
我写了一个 fiddle,它只使用一个计算的可观察对象,而且我没有焦点问题。这是否如您所愿?
var displayString = ko.observable('');
var formattedString = ko.computed({
read: function () {
return displayString();
},
write: function (newValue) {
var f = format(newValue);
console.debug("Format", newValue, "=", f);
displayString(f);
}
});