0

我正在尝试实现一种在 ko 文档中的简单示例 1 中为具有焦点绑定但应用于包含表单的 div 的简单示例 1 中所做的事情,并且仅在一个方向上就可以了

在下面的代码中使用 focusout 我遇到的问题是,一旦将 focusOnDiv 设置为 true,如果我从一个输入更改为另一个,则会触发事件并且返回 false。我期待不会被触发,因为它在 div 内。我可以在同一个事件绑定中使用 focusin 将其设置为 true 就像在小提琴中一样,但我怀疑这个解决方案是否可以接受

html:

<div tabindex ="-1" class="parentdiv" data-bind="event: { focusout: resetFocusOnDiv}">
     <p><div>Just a div</div></p>
     <p><span>And a span</span></p>
     <p><select>
         <option>First</option>
         <option>Second</option>
         </select>
     </p>
     <input type="checkbox">Checkbox</input>
    <p><input data-bind="value: firstValue" /></p>
    <p><input data-bind="value: secondValue" /></p>
</div>
<div data-bind="text: focusOnDiv"></div>
<input type="button" data-bind="click: setFocusOnDiv" value="Click">

JS:

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

    self.firstValue = ko.observable('a');
    self.secondValue = ko.observable('b');

    self.focusOnDiv = ko.observable(false);

    self.setFocusOnDiv = function(){
        self.focusOnDiv(true);
    };

    self.resetFocusOnDiv = function(){
        self.focusOnDiv(false);
    };
};


ko.applyBindings(new viewModel());

在这里提琴

4

1 回答 1

0

如果我正确理解了这个问题,那么您想在击倒按钮时将元素焦点放在单击按钮上。您可以通过使用 focus 函数来完成这样的任务:

<input type="button" data-bind="click: focusDiv" value="Click">

self.focusDiv = function(){
     $('#focusId').focus();
};
于 2014-02-05T18:27:34.373 回答