將擊鍵附加到div JS

我在想，如果有的話，框架將是最好的實現捕獲鍵擊並將它們附加到，例如「p」元素。我想要實現的是讓客戶端在鍵盤上鍵入內容，然後將該句或其他內容附加到html中，從而將其顯示在「p」元素中。將擊鍵附加到div JS

重要聲明;我不想在給定的按鍵時調用一個函數 - 例如。 shift + alt，而我試圖做的是，將鍵盤輸入流式傳輸到html元素。

來源

2016-02-13 Rasmus Hjorth Lüdeking

您不一定需要該任務的框架。

除了凱克里斯滕森的另一個possbily可行的辦法是可視屏幕面積之外創建一個文本框，自動將焦點設置到該文本框，併爲文本框的變化監聽器。

只要發生更改，您就可以簡單地將目標元素的內容替換爲文本框的內容。

這樣可以節省人工聽鍵盤事件，區分大小寫字母等

來源

2016-02-13 18:00:41 Timo

「_this節省了您手動聽鍵盤事件，區分的麻煩大寫和小寫字母etc_」 - '文件.body.addEventListener（「keypress」，function（e）{console.log（String.fromCharCode（e.which）;}）'（[fiddle]（https://jsfiddle.net/epyw51jh/）） – Andreas

@And reas夠了，大小寫工作正常。當涉及換行或退格時，您仍然遇到麻煩 – Timo

，我肯定會用jQuery去與包含最新版本的更新字符串的相同屬性的div捕獲鍵，然後不斷.replace()您div。 Codecademy對這種類型的jQuery使用有很大的經驗。

雖然我不是專家。我相信別人比我自己有更好的答案。

來源

2016-02-13 17:58:48

像這樣的麻煩？

的Html

<p id="text"></p> 
<input id="textinput"></input>

的js

//Register on keyup, append text from input-field to <p> element. 
window.addEventListener("keyup", function() { 
    document.getElementById("text").innerHTML=document.getElementById('textinput').value; 
});

的jsfiddle：https://jsfiddle.net/vwobq9xf/1/

來源

2016-02-13 18:20:35 user2267175

將擊鍵附加到div JS

回答

相關問題