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位于模板

字段的输入中

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

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

P.S

对此的任何答案也必须适用于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键，我能够确保下一个输入始终是焦点

感谢@neps推动正确的方向

工作Plunker

Knockout具有多个输入的焦点

1 个答案: