需要knockoutjs和綁定按鍵事件的一些幫助。我正試圖勾搭淘汰賽,這樣我就可以從文本框中選擇輸入按鍵。所以我可以執行與點擊按鈕相同的操作。它有點棘手的解釋,但希望這個JsFiddle將展示我想要實現的。在knockoutjs上綁定按鍵事件,可觀察未填充
我的問題是,觀察到的值不會得到更新,我認爲它的東西與可觀察到的不被更新,直到焦點移動從文本框離開呢?
對此問題的任何解決方案。
謝謝!
需要knockoutjs和綁定按鍵事件的一些幫助。我正試圖勾搭淘汰賽,這樣我就可以從文本框中選擇輸入按鍵。所以我可以執行與點擊按鈕相同的操作。它有點棘手的解釋,但希望這個JsFiddle將展示我想要實現的。在knockoutjs上綁定按鍵事件,可觀察未填充
我的問題是,觀察到的值不會得到更新,我認爲它的東西與可觀察到的不被更新,直到焦點移動從文本框離開呢?
對此問題的任何解決方案。
謝謝!
一種選擇是使用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/
不打折提交綁定: http://knockoutjs.com/documentation/submit-binding.html
這照顧了一些IE 9/10的陷阱,比如返回鍵沒有更新observable。有了這個照顧你不需要攔截鍵碼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());
看到這個位置:
除非沒有:https://github.com/SteveSanderson/knockout/issues/760 – Szabi 2013-04-05 12:23:12
你有就在我之前http://jsfiddle.net/nbnML/10/ – Arbiter 2012-07-24 13:35:19
Darned有幫助,謝謝。 – 2013-01-01 21:57:01
真棒回答。然而在Firefox上按下文本框上的Enter會導致事件觸發兩次。有什麼有用的想法嗎? – Nikhil 2013-03-06 13:57:32