我正在尝试实现一种在 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());
在这里提琴