我正在製作一個網站，其中會有很多輸入字段。有點像掃描儀，我想按下輸入時禁用每個輸入。動態按下輸入時禁用輸入

我現在有這樣的：

<input (keyup.enter)="doSomething()"/>

但我想沿着輸入本身，所以我可以禁用這些輸入通過。（FE類似：？doSomething(input) { input.attr.disabled = true; }

我怎麼能在我的doSomething功能得到這個輸入字段

注意：我不想使用像<input #input ...，因爲我有這麼多的輸入字段這不僅會創造了大量的工作

所有我想要的是，每個進入時間輸入字段中被按下時，它被禁用（僅使用一個所有功能）

來源

2017-07-06 Ivaro18

你嘗試使用目標事件屬性嗎？ – Vinay

不，您能舉一個例子說明我可以如何將事件傳遞給我的函數嗎？ – Ivaro18

創建一個指令，用於偵聽輸入上的keyup.enter，然後在輸入上設置disabled屬性。這可以用這樣的指令來完成：

@Directive({ 
    selector: 'input[disable-on-enter]', 
}) 
export class DisableOnEnterDirective { 
    @HostBinding('attr.disabled') isDisabled; 
    @HostListener('keyup.enter') disableInput() { 
    this.isDisabled = true ; 
    } 
}

它可以這樣使用：

<input disable-on-enter placeholder="Press enter to disable" />

Demo

來源

2017-07-06 15:58:16

真棒回答，愛指令的想法。謝謝 – Ivaro18

你可以這樣做：。

<input (keyup.enter)="doSomething($event)"/> 

doSomething(event) { event.target.disabled = true; }

來源

2017-07-06 15:56:12 willmaz

您也可以嘗試這樣的事情，

<input id="reply" name="reply" onKeyPress="enterpressalert(event)"/> 

<script> 
function enterpressalert(e){ 
var code = (e.keyCode ? e.keyCode : e.which); 
if(code == 13) { //Enter keycode 
e.target.disabled = true; 
} 
} 
</script>

來源

2017-07-06 15:59:15 Vinay

動態按下輸入時禁用輸入

回答

Demo

相關問題