从第一个文本框输入文本后,我需要移动下一个文本框.在第一个选项卡中键入文本到下一个选项卡后,它必须自动移动.
<div class="autotabbed-container">
<div id="example1" class="autotabbed">
<h3>Bank sort code: XX-XX-XX</h3>
<input type="text" maxlength="2" size="2" />
-
<input type="text" maxlength="2" size="2" />
-
<input type="text" maxlength="2" size="2" />
</div>
</div>
当我在第一个文本框中键入文本时,光标需要移动下一个文本框.请帮助如何在角4中实现这一点.
如果我想申请ngFor,相同的代码不起作用.在下面的代码中,如果我想显示基于ngFor循环的文本框.在第一个td我将显示密码文本框,然后我将显示只有星号.在这种情况下,我们如何动态应用#input.我只需指向第一个td项而不是下一个td项.所以在这种情况下我们如何实现自动对焦.
<tr>
<ng-container *ngFor="let i of dynamicArr,let x = index">
<td *ngIf="i !== '*'">
<input type="password" #input1 formControlName="dyna{{i}}" id="dyna{{i}}" (input) = "onInputEntry($event,input2)" required maxlength="1" />
</td>
<td *ngIf=" i === '*' ">
<img class="flotado_right" id="starimage" src="starimage.jpg" class="dot-image">
</td>
</ng-container>
</tr>
我正在构建如下的动态数组,动态文本的值为2 5和7.在这种情况下dynamicArr [2] = 1,dynamicArr [5] = 2,dynamicArr [7] = 3因此dynamicArr值的其他值为*
for (let i = 0; i < 10; i++) {
if (((i + 1) === this.dynamictext[0])) {
this.dynamicArr[i] = '1';
} else if (((i + 1) === this.dynamictext[1])) {
this.dynamicArr[i] = '2';
} else if (((i + 1) === this.dynamictext[2])) {
this.dynamicArr[i] = '3';
} else {
this.dynamicArr[i] = '*';
}
}
解决方法
这可以这样做
HTML
HTML
<tr>
<ng-container *ngFor="let i of dynamicArr,let x = index">
<td *ngIf="i !== '*'">
<input #tab type="password" id="tab{{i}}" required maxlength="1" class="tab" (input)="onInputEntry($event,'tab',(i))" />
</td>
<td *ngIf=" i === '*' " class="image">&</td>
</ng-container>
</tr>
零件
onInputEntry(event,id,nextInputIndex) {
let input = event.target;
let nexInput = +nextInputIndex + 1;
let newID = id + nexInput;
document.getElementById(newID).focus();
}
