12

需要一些关于 knockoutjs 和绑定按键事件的帮助。我正在尝试连接淘汰赛,以便我从文本框中选择输入键。所以我可以执行与单击按钮相同的操作。解释起来有点棘手,但希望这个 JsFiddle 能展示我想要实现的目标。

http://jsfiddle.net/nbnML/8/

我遇到的问题是 observable 值没有得到更新,我认为这与 observable 在焦点离开文本框之前没有更新有关吗?

这个问题的任何解决方案。

谢谢!

4

2 回答 2

38

一种选择是使用valueUpdate附加绑定在每次按键时强制更新。例如,你会这样做:

<input type="text" data-bind="value: InputValue, valueUpdate: 'afterkeydown', event: { keypress: RunSomethingKey }" />

如果这不是你所追求的,那么你真的想在你的处理程序中触发元素的更改事件。例如,使用 jQuery,您可以执行以下操作$(event.target).change();

将它移到自定义绑定中会更好。也许是这样的(可能应该检查 valueAccessor() 的结果是否是一个函数):

ko.bindingHandlers.enterKey = {
    init: function(element, valueAccessor, allBindings, vm) {
        ko.utils.registerEventHandler(element, "keyup", function(event) {
            if (event.keyCode === 13) {
                ko.utils.triggerEvent(element, "change");
                valueAccessor().call(vm, vm); //set "this" to the data and also pass it as first arg, in case function has "this" bound
            }

            return true;
        });
    }         
};

这是您更新的示例:http: //jsfiddle.net/rniemeyer/nbnML/9/

于 2012-07-24T13:34:45.253 回答
1

不要打折提交绑定: http: //knockoutjs.com/documentation/submit-binding.html

这可以解决一些 IE 9/10 的问题,例如返回键不更新 observable。有了这个照顾,你不需要拦截 keycode 13

html:

<form data-bind="submit:RunSomething">
 <input type="text" data-bind="value: InputValue" />
 <input type="submit" value="test" />
 <div data-bind="text: InputValue" />
</form>

代码:

var ViewModel = function () {
    var self = this;
    self.InputValue = ko.observable('');

    self.RunSomething = function (ev) {
        window.alert(self.InputValue());
    }
}
ko.applyBindings(new ViewModel());

在这里看到这个:

http://jsfiddle.net/jnewcomb/uw2WX/

于 2013-04-04T14:56:26.460 回答