输入按键的敲除事件绑定导致奇怪的行为

Question

长话短说，我想使用户能够在输入元素上按回车，然后调用我的视图模型中的某些方法。这是我的html输入：

<input id="searchBox" class="input-xxlarge" type="text" data-bind="value: searchText, valueUpdate: 'afterkeydown', event: { keypress: $parent.searchKeyboardCmd}">

这是我在vm中的方法：

searchKeyboardCmd = function (data, event) { if (event.keyCode == 13) searchCmd(); };

一切正常，当我在输入上按Enter键时，会调用searchCmd，但问题是我无法在输入中键入任何内容，即，我键入的所有内容都将被忽略。预先感谢您的帮助。

Answer 1

根据KO文档，如果要继续执行默认操作，则必须从事件处理程序中返回true。

searchKeyboardCmd = function (data, event) {
    if (event.keyCode == 13) searchCmd();
    return true;
};

Answer 2

here's一个小提琴，该小提琴演示了您试图执行的操作，并用keyup替换了您代码中的事件'keypress'，并仅用函数名删除了$ parent，除非文本字段位于敲除foreach循环内。修改后的代码

<input id="searchBox" class="input-xxlarge" type="text" data-bind="value: searchText, valueUpdate: 'afterkeydown', event: { keyup: searchKeyboardCmd}"

Answer 3

这里是一个工作示例。

http://jsfiddle.net/tlarson/qG6yv/

<!-- ko with: stuff -->
  <input id="searchBox" class="input-xxlarge" type="text" 
    data-bind="value: searchText, valueUpdate: 'afterkeydown', 
    event: { keypress: $parent.searchKeyboardCmd}">   
<!-- /ko -->

和javascript：

var stuffvm = function(){
    var self = this;

    self.searchText = ko.observable();
};

var vm = function() {
    var self = this;

    self.stuff = new stuffvm();

    self.searchCmd = function() {
        console.log("search triggered");
    };

    self.searchKeyboardCmd = function (data, event) { 
        if (event.keyCode == 13) {
            self.searchCmd(); 
        }
        return true;
    }
}

ko.applyBindings(new vm());