Knockout textInput和maskedinput插件 [英] Knockout textInput and maskedinput plugin
问题描述
是否有一种简单的方法可以使用 data-bind =textInput：aProperty并在用户输入时添加输入掩码或一些自动格式 ？
Is there an easy way to use data-bind="textInput: aProperty" and add an input mask or some automatic formatting as the user types?
使用屏蔽输入插件类的工作，但我失去了Knockout的textInput：提供的as-you-type更新，因此脚本的其他部分只能在字段失去焦点后看到更改（有效地表现为普通的旧版本） 值：在Knockout中的绑定。）
Using the masked input plugin kind of works, but I lose the "as-you-type" updates that Knockout's "textInput:" provides, so other parts of the script only see the change after the field loses focus (effectively behaving as a plain old "value:" binding in Knockout).
一个天真的解决方案，带有一个计算的observable，格式化不起作用，因为对每个更新的字段的每次击键都会改变将焦点输入到页面中的其他位置，这样用户就无法继续输入。
A naïve solution with a computed observable that does the formatting doesn't work because each keystroke to a field that updates itself changes the input focus to somewhere else in the page, so the user can't keep typing.
我可以让这两个库相互配合使用，还是应该自定义解？他们在事件处理程序中做了很多事情，以便与所有浏览器兼容，因此很难让它们一起工作，但这也正是为什么我不想摆弄所有这些键盘，输入，改变，事件由我自己。
Can I make these two libraries play nice with each other or should I make my custom solution? They do a lot of things in their event handlers to be compatible with all browsers, so it's not a surprise that it's hard to make them work together, but that is also exactly why I don't want to fiddle with all those keyup, input, change, events by myself.
StackOverflow之前的所有答案都不介意只在字段失去焦点后传播更改。也许这些答案是在textInput被添加到Knockout之前发布的，所以当时没有更好的东西。这就是我问一个新问题的原因。
推荐答案
我写过一个只使用计算机的小提琴可观察的，我没有焦点问题。这是否按预期工作？
I've written a fiddle that uses just a computed observable, and I don't have a focus problem with it. Does this work as you expect?
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);
}
});
这篇关于Knockout textInput和maskedinput插件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
