Textbox事件绑定和textbox值

Question

我的文本框是：

 <input type="text" class="form-control textbox" data-bind="value: nameValue, , event: { 'keyup': checkIfTextBoxEmpty }" />

正如您在上面看到的，我正在我的文本框上使用keyup事件。

“淘汰赛”中的事件如下：

   self.checkIfTextBoxEmpty = function (data, event) {
       //To check if textbox is empty
       if(data.nameValue() == '')
        {
           //hide a span tag 
        }
    }; 

当用户没有输入值并按下我页面上的按钮时，我已经将验证器连接到这个文本框上，它显示了错误“字段是必需的”。

如果它们在textbox中输入无效的值，则在我的按钮单击时检查它，并在textbox下方的span中显示为错误。

当用户输入无效值并按下按钮时会出现问题，它会显示无效值错误，而当用户删除在文本框中输入的值时，则会同时显示所需的字段错误和无效值错误。

所以我把"keyup“事件绑在文本框上。在这里，我想检查该值是否为空，我将隐藏span标记，以便它只显示所需的字段错误。

但是在我的keyup事件中，data.nameValue()总是没有定义，所以我无法检查它们输入的值。

这里还有什么需要做的吗。

谢谢。

Answer 1

Tomalak上面提到的答案是正确的方法。

有关如何使用事件的答案，您可以尝试以下代码。

 <input type="text" class="form-control textbox" data-bind="value: nameValue, 
 valueUpdate: 'value' , event: { 'keyup': checkIfTextBoxEmpty }" />

Answer 2

正如您在上面看到的，我正在我的文本框上使用keyup事件。

你不应该。你根本不应该用任何活动。使用绑定和计算值。

​

function VM() {
  var self = this;

  self.nameValue = ko.observable('');
  
  self.nameIsEmpty = ko.computed(function () {
    return self.nameValue() == '';
  });
};

var vm = new VM();
ko.applyBindings(vm);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<input type="text" data-bind="textInput: nameValue">

<span data-bind="visible: nameIsEmpty">Field is required</span>

​

从长远来看，您应该学习敲除-验证插件，而不是滚动自己的验证代码。