Validation 使淘汰验证在页面加载时不触发

我正在尝试使用Knockout实现验证，并尝试了Bob示例

CSS:

在初始页面加载时，文本框中不会有任何数据。所以我删除了硬编码的名字。 现在，验证消息显示在页面加载上，而不是用户离开文本框时。 不知何故，KO在页面加载过程中认为textbox值已更改，并触发验证代码

我该如何阻止这种情况发生

下面是我试图尝试的用例。 我有两个文本框，一个需要显示没有消息的红色边框，另一个需要在验证时显示消息

---

谢谢

初始验证由以下行触发：

 validate(target());

评论一下

但是现在，如果你输入空文本框，跳出它，没有任何变化：聚焦时字段是空的，模糊时字段是空的。因此，可观察对象不会改变，订阅也不会触发

所以，您需要做的是触发模糊验证，而不仅仅是更改验证。您需要订阅绑定元素的blur事件来进行额外的验证。但这是不可能的，因为你不能接触到可观察的事物所绑定的元素

就我所能想到的解决方案而言，由于您只能访问可观察对象，您无法通过扩展器实现您想要的

您需要创建一个允许您访问元素的。在这种情况下，您可以访问元素、与扩展器目标等效的值访问器以及元素中的所有其他绑定。这是自定义绑定更新函数的签名：

function(element, valueAccessor, allBindings)

我已经创建了一个所需自定义绑定处理程序的示例实现，您可以将其用作一个启动点，代码如下：

HTML:

---

如果您正在使用链接页面中的ko.extenders.required，只需删除行//initial validation validatetarget；行以禁用初始值validation@nemesv这将删除初始验证，但现在即使用户离开文本框，验证也不会启动。您可以为其创建JSFIDLE吗？请不要在不向问题添加代码的情况下请求/添加FIDLE，否则，问题取决于一个可能会崩溃的异地链接。您还需要使用notify:“always”扩展器，因为否则，当模糊事件触发时，将不会为可观察对象触发更改事件，因为没有chagne，所以您的验证器不会触发“像这样做，仍然不行！”@代码帮助。很抱歉，这个答案不准确。现在我为您添加了额外的信息。@Codehelp为原始答案添加了替代选项

.validationError{
        border:solid 1px red;
    }

 validate(target());

function(element, valueAccessor, allBindings)

<input type="text" data-bind="value: name, required: 'Name required'">
<span data-bind="visible: name.hasError, text: name.requiredMessage"></span>
<br/>
<input type="text" data-bind="value: age, required: 'Age required'">
<span data-bind="visible: age.hasError, text: age.requiredMessage"></span>

ko.bindingHandlers.required = {
    init: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        // This will be called when the binding is first applied to an element
        // Set up any initial state, event handlers, etc. here
        console.log('Init', element);
        var valueObs = allBindings.get('value');
        valueObs.hasError = ko.observable(false);
        valueObs.requiredMessage = ko.observable(ko.unwrap(valueAccessor()));
        valueObs.firstTime = true;
        $(element).blur(function() {
            console.log('Blur');
            valueObs.hasError(!valueObs());
        });
    },

    update: function(element, valueAccessor, allBindings, viewModel, bindingContext) {
        // This will be called once when the binding is first applied to an element,
        // and again whenever any observables/computeds that are accessed change
        // Update the DOM element based on the supplied values here.
        var valueObs = allBindings.get('value');
        console.log('value: ', valueObs());
        if (valueObs.firstTime) {
            valueObs.firstTime = false;
            return;
        }
        valueObs.hasError(!valueObs());
    }
};

var vm = {
    name: ko.observable(""),
    age: ko.observable("")
};

ko.applyBindings(vm);