淘汰赛验证限制

Question

你好，我有一个输入类型的 css 绑定，如果它与我的功能匹配，它会添加 class CircleErrors。我的问题是它在关闭 class 时有延迟，只有当我关闭输入框时才会发生。我希望在按下键盘时删除 class。我知道有一个油门可以用于击倒，但我不确定如何去做。

<input id="firstName" type="text" placeholder="First name" data-bind="value: Registration.FirstName, css: { CircleErrors: Registration.FirstName().length == 0 && Registration.FirstNameValidation(), valueUpdate: 'afterkeydown' }">

Answer 1

您放错了 valueUpdate 参数。它在 css 参数内 - 您需要将它移到 }:

之外

<input id="firstName" type="text" placeholder="First name" data-bind="value: Registration.FirstName, css: { CircleErrors: Registration.FirstName().length == 0 && Registration.FirstNameValidation() }, valueUpdate: 'afterkeydown'">

Here's a demo with it working

Answer 2

对名字属性（以及与此相关的任何文本输入字段）使用 textInput 绑定而不是值绑定。引用文档

Unlike the value binding, textInput provides instant updates from the DOM for all types of user input, including autocomplete, drag-and-drop, and clipboard events.

您不再需要 valueUpdate 绑定，但是它在您的 CSS 绑定中，因此不会产生任何影响。

<input id="firstName" type="text" placeholder="First name" data-bind="textInput: Registration.FirstName, css: { CircleErrors: Registration.FirstName().length == 0 && Registration.FirstNameValidation() }">

Answer 3

Demo

这就是您要找的 ` var reg = new (函数() { 变种自我=这个； this.FirstName = ko.observable(''); this.checkifEmpty = ko.observable(假);

this.check=function(){
    if(this.FirstName()!=null&&this.FirstName()!=undefined &&     this.FirstName() !=''){
     this.checkifEmpty(true);
    }else{
             this.checkifEmpty(false);

    }
}
this.FirstNameValidation = function() {
    return true;
}

})();

ko.applyBindings(reg);

`

淘汰赛验证限制

Knockout validation throttle

javascript

knockout.js