Typescript鍵盤監聽器可以防止輸入HTML輸入表單

我正在開發一個帶有Angular2的Web應用程序，其中一個組件需要監聽鍵盤以檢查是否按下了「D」鍵。這工作正常，除了它阻止我輸入駐留在另一個組件中的HTML <input>。我猜這是由鍵盤監聽器類中的一段代碼引起的，但我不確定它在哪裏。Typescript鍵盤監聽器可以防止輸入HTML輸入表單

下面是監聽器類，在它的全部：

export class Keyboard { 

    private keyboard_d; 

    constructor(){ 
     this.keyboard_d = Keyboard.keyboard(68); 
    } 

    static keyboard(keyCode){ 
     var key = { 
      code: keyCode, 
      isDown: false, 
      isUp: true, 
      press: undefined, 
      release: undefined, 
      downHandler: function(event){ 
       if (event.keyCode === key.code) { 
        if (key.isUp && key.press) key.press(); 
        key.isDown = true; 
        key.isUp = false; 
       } 
       event.preventDefault(); 
      }, 
      upHandler: function(event) { 
       if (event.keyCode === key.code) { 
        if (key.isDown && key.release) key.release(); 
         key.isDown = false; 
         key.isUp = true; 
        } 
        event.preventDefault(); 
       } 
      } 

     //Attach event listeners... 
     window.addEventListener(
      "keydown", key.downHandler.bind(key), false 
     ); 
     window.addEventListener(
      "keyup", key.upHandler.bind(key), false 
     ); 
     return key; 
    } 

    //Returns true if the D key is pressed down, false if it is not. 
    public isDpressed(){ 
     return this.keyboard_d.isDown; 
    } 
}

這個類是在Angular2組件中使用這樣的：

var keyboard_listener = new Keyboard(); //create 
var dPressed : boolean = keyboard_listener.isDPressed();

凡在該代碼它阻止我打字到HTML輸入表單？

注意我故意遺漏了兩個相關組件的角碼，因爲如果我不需要，我不想添加angular2標籤，我的直覺說上面的代碼是問題所在。但是，如果認爲有必要，我會編輯帖子並添加角碼和標籤。

來源

2017-01-22 JavascriptLoser

你有沒有嘗試刪除事件處理程序中的防止默認代碼？ – toskv

這已修復它！謝謝！如果您喜歡，您可以發佈正確的答案，我會將其標記爲已接受。 – JavascriptLoser

呼叫event.preventDefault會停止該事件的默認行爲，並因此在輸入字段中不顯示該字符。

來源

2017-01-23 00:07:49 toskv

Typescript鍵盤監聽器可以防止輸入HTML輸入表單

回答

相關問題