Knockout textInput和maskedinput插件

有沒有簡單的方法來使用data-bind="textInput: aProperty"並添加輸入掩碼或某些自動格式化作爲用戶輸入？Knockout textInput和maskedinput插件

使用masked input插件類型的作品，但是我失去了Knockout的「textInput：」提供的「原始類型」更新，因此腳本的其他部分僅在字段失去焦點後纔看到更改作爲普通的老式「價值：」在Knockout中的綁定）。

一個天真的解決方案，使用計算的可觀察格式化不起作用，因爲每次鍵入到更新自身的字段都會將輸入焦點更改爲頁面中其他位置，因此用戶無法繼續輸入。

我可以讓這兩個庫彼此玩起來不錯，還是應該讓我的自定義解決方案？他們在事件處理程序中執行了很多與所有瀏覽器兼容的操作，因此很難讓它們一起工作並不令人意外，但這也正是我不想擺弄所有這些鍵盤輸入，改變，我自己的事件。

StackOverflow的所有以前的答案不介意只有在領域失去焦點後傳播更改。也許這些答案是在textInput添加到Knockout之前發佈的，所以當時沒有更好的答案。這就是爲什麼我要問一個新問題。

2015-05-22 marcus

我寫了一個只使用計算觀察值的小提琴，我沒有焦點問題。這是否按預期工作？

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); 
    } 
});

http://jsfiddle.net/csmmnq25/

來源

2015-05-22 22:26:23

看起來你無法不移動光標和搞亂一切行動（包括退格鍵）在末尾添加任何東西（如「.00」）。這與我以前看到的行爲不完全相同，但它似乎是相關的。 – marcus

每次重寫值時，光標都位於末尾。如果您要添加到最後，這很好，但如果您在中間進行編輯則會出現問題。根據格式的不同，將光標放在字段中可能會非常棘手。 –

我猜我的焦點問題與KO的foreach有關（我在表格中有多個輸入）。當我的表單不循環時，我將使用您的解決方案，並且我不希望用戶在中間插入某些內容（如果每次按鍵後都自動添加分數，則任何數字都需要在中間進行編輯...） – marcus

Knockout textInput和maskedinput插件

回答

相關問題