请考虑this jsfiddle 。它包含以下内容:
<textarea data-bind="value: comment, valueUpdate: 'afterkyedown'"></textarea>
<br/><br/>
<span data-bind="text: getCount, valueUpdate: ['afterkeydown','propertychange','input']"></span> characters???
还有这个 JavaScript:
var viewModel = function(){
var self = this;
self.count = ko.observable(0);
self.comment = ko.observable("");
self.getCount = function(){
var countNum = 10 - self.comment().length;
self.count(countNum);
};
}
var viewModel12 = new viewModel();
ko.applyBindings(viewModel);
我有一个文本区域,最大长度应为 20 个字符。当字符数达到20时,它将停止,如果您尝试添加更多字符,它们将被删除。
请注意,这也适用于复制/粘贴:如果用户粘贴超过 20 个字符,则仅保留前 20 个字符,其余的应删除。
最佳答案
看看this jsfiddle ,其工作原理如下:
var viewModel = function(){
var self = this;
self.comment = ko.observable("");
self.count = ko.computed(function(){
var countNum = 10 - self.comment().length;
return countNum
});
}
var vm = new viewModel();
ko.applyBindings(vm);
<textarea data-bind="value: comment, valueUpdate: 'afterkeydown'"></textarea>
<br/><br/>
<span data-bind="text: count"></span> characters
您需要了解ko.computed()做这种事情...
关于knockout.js - 如何构建具有字符计数器和最大长度的文本区域?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12982587/