我如何在html和javascript中創建假輸入

Question

我需要創建一個假輸入，以便我可以將內容更改爲html元素。

像Desmos應用程序，你可以鍵入類似：a^b，它會在HTML更改爲^b女巫：a<sup>b</sup。

也看到，確實語法高亮顯示，自動完成，等Monaco Editor

我熟悉contenteditable屬性，但在演示他們不使用它。

在這兩個應用程序中，它們實現假輸入而不使用文本區域 ，隱藏輸入或contenteditable屬性。

所以我的問題是如何實現這種行爲，並實現假輸入，onblur，oncopy等處理函數的虛假輸入 。

Answer 1

您可以使用keydown/keyup/keypress事件來編輯僞造字段中的內容。 事情是這樣的：

$(document).click(function (e) { 
    if($(e.target).is("#your_editor")) { 
     // editor area focused 
     if($(this).hasClass("focused")) { 
      return; 
     } 
     $(this).addClass("focused"); 
    } else { 
     // editor area is not focused 
     $("#your_editor").removeClass("focused"); 
    } 
}); 

$(document).keydown(function (e) { 
    // some key are pressed 
    if($("#your_editor").hasClass("focused")) { 
     // do something with e.keyCode 
    } 
});