javascript - 具有多个输入的 Knockout Has-focus

Question

我正在使用 knockoutjs 并且在我的模板中我有一个 foreach 循环，它将显示它从 JSON 数据中获取的数据 我想将焦点设置为第一个在屏幕上输入时，当屏幕上只有输入时，它工作得很好，但是当它到达第二个屏幕时，有两个输入，它只将焦点设置到屏幕上的最后一个输入

这是我的HTML:

<div id="section">
<span data-bind="template: { name: 'screenTemplate', foreach: screens, as: 'screen'}"></span>
<script type="text/html" id="screenTemplate">
    <!-- ko if: showFlds -->
    <!-- ko if: showNote -->
    <span data-bind="template: { name: 'fldTemplate', foreach: flds}"></span>
    <!--/ko-->
    <!--/ko-->
</script>

<script type="text/html" id="fldTemplate">
    <form>
    <span class="text" data-bind="text: fieldName"></span>
    <br/>
    <input type="text" class="inputVal" data-bind="valueUpdate: 'afterkeydown', value: inputValue, disable: (inputValue() == expectedValue()), visible:(inBool() != false)" />
    <br/>
  </form>
</script>

<div data-bind="visible:screens()[cScreen()].rdtNote() === true">
    <h2 style="color: red"><span data-bind="text: rdtNotification()[0].description()"></span></h2>
    <button data-bind="click: makeHidden">Acknowledged</button>
</div>

如图所示，hasFocus 位于模板字段中的输入上

我想知道是否有一种方法可以让它将焦点放在第一个输入上，然后在输入正确后移至下一个输入

如果需要更多信息，请询问我会尽力提供

附言

• 对此的任何回答都必须在 IE6 中也有效，因为它最终将在 IE6 扫描枪上运行

当前进度:我用过 jQuery

$(document).ready(function(){
  $('form').find('input[type=text],textarea,select').filter(':input:enabled:visible:first').focus();
})

但是当使用它时，当屏幕改变时它不会自动选择下一个输入有没有办法让它工作？

Answer 1

解决了我的问题:

$(document).ready(function() {
 $('form').find('input[type=text],textarea,select').filter(':input:enabled:visible:first').focus();
});

$(document).keyup(function(e){
 $('form').find('input[type=text],textarea,select').filter(':input:enabled:visible:first').focus();
});

var e = $.Event("keyup", { keyCode: 13}); //"keydown" if that's what you're doing
$("body").trigger(e);

使用它我能够将焦点设置到第一个可见的启用输入，然后使用 jQuery 触发 Enter Key 键我能够确保下一个输入始终被聚焦

感谢@neps 在正确方向上的插入

工作 Plunker