Javascript knockoutjs上的绑定按键事件,未填充可观察
需要一些关于knockoutjs和绑定keypress事件的帮助。我正在尝试连接knockout,以便在文本框中按enter键。因此,我可以执行与单击按钮相同的操作。解释起来有点棘手,但希望这个JsFiddle将展示我试图实现的目标 我的问题是,可观察值没有得到更新,我认为这与在焦点离开文本框之前不更新可观察值有关 这个问题的任何解决方案Javascript knockoutjs上的绑定按键事件,未填充可观察,javascript,knockout.js,Javascript,Knockout.js,需要一些关于knockoutjs和绑定keypress事件的帮助。我正在尝试连接knockout,以便在文本框中按enter键。因此,我可以执行与单击按钮相同的操作。解释起来有点棘手,但希望这个JsFiddle将展示我试图实现的目标 我的问题是,可观察值没有得到更新,我认为这与在焦点离开文本框之前不更新可观察值有关 这个问题的任何解决方案 谢谢 一个选项是使用valueUpdate附加绑定强制每个按键进行更新。例如,您将执行以下操作: <input type="text" data-bi
谢谢 一个选项是使用
valueUpdate
附加绑定强制每个按键进行更新。例如,您将执行以下操作:
<input type="text" data-bind="value: InputValue, valueUpdate: 'afterkeydown', event: { keypress: RunSomethingKey }" />
以下是更新后的示例:不要打折提交绑定: 这就解决了一些IE 9/10的问题,比如返回键不更新可观测值。有了这些,你就不需要截取键码13了 html: 请看这里:
回答得真棒。但是在firefox上,按文本框上的Enter键会导致事件触发两次。有什么有用的想法吗?@Nikhil-可能需要做一些像
e.stopPropagation()
?@RP-这救了我!谢谢你发布这个!我注意到,如果您添加字段,将KO数据绑定放在字段上,但忘记将其添加到ViewModel中,则会出现问题。但这是我自己在实现过程中犯的错误,而且不管怎样,当您这样做时,可能会中断KO。但我只想提醒那些可能想知道是这段代码,还是他们在使用它时所做的事情导致它崩溃的人——很可能是他们!再次感谢。不过,当我运行此命令时,我注意到我不需要valueAccessor().call()
语句。
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;
});
}
};
<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());