单击后Knockout.js输入焦点

Question

我试图在click事件被触发后将注意力集中在具有knockout的输入上,但是在没有与DOM耦合的情况下找不到干净的方法来处理它.这是我的JS代码:

(function() {

    var vm = {
        text: ko.observable(),
        items: ko.observableArray([])
    }

    vm.addItem = function() { 
        vm.items.push(vm.text());
        vm.text(null);
    }

    ko.applyBindings(vm);

}());

这是我的DOM:

<input type="text" data-bind="value: text" />
<a href="#" data-bind="click: addItem">Send</a>

<ul data-bind="foreach: items">
    <li data-bind="text: $data"></li>
</ul>

这是JsFiddle示例:http://jsfiddle.net/srJUa/1/

我希望它在vm.addItem完成后将注意力集中在输入上.知道如何干净利落地完成这项任务,例如使用自定义淘汰赛绑定吗？

Answer 1

Knockout有一个用于操作焦点的内置绑定:"hasfocus"绑定.

因此,您只需要在viewmodel上创建一个布尔属性,并将其绑定在输入上,true如果要聚焦输入,则将属性设置为.

或者在您的情况下,您可以直接绑定到您的text属性,所以当它没有任何文本时,它应该具有焦点:

<input type="text" data-bind="value: text, hasfocus: !text()" />

演示JSFiddle.