Как только нажать клавишу внутри div? - PullRequest
Новая
       14

Как только нажать клавишу внутри div?

1 голос
/ 15 мая 2019

Я пытаюсь нажать клавишу внутри div. Но я не уверен, как просто нажать клавишу. В настоящее время, когда я пытаюсь нажать клавишу, ничего не происходит.

Я так и делаю. 

<div contenteditable="true" id="d"> </div>

<p id="log"></p>


const input = document.querySelector('input');
const log = document.getElementById('log');

document.getElementById("d").addEventListener("onkeyup", logKey)

function logKey(e) {
   log.textContent += ` ${e.code}`;
}

Вот также соответствующий jsfiddle: https://jsfiddle.net/hpeLqmyg/

Как я мог это сделать?

Ответы [ 3 ]

2 голосов
/ 15 мая 2019

изменить onkeyup на keyup

document.getElementById("d").addEventListener("keyup", logKey)

https://jsfiddle.net/2x8pcu0m/

0 голосов
/ 15 мая 2019

Изменить onkeyup на keyup

const log = document.getElementById('log');

document.getElementById("d").addEventListener("keyup", logKey)

function logKey(e) {
  log.textContent += ` ${e.code}`;
}
<div contenteditable="true" id="d"> </div>

<p id="log"></p>

Вы также можете использовать e.key вместо code

const log = document.getElementById('log');

document.getElementById("d").addEventListener("keyup", logKey)

function logKey(e) {
  log.textContent += ` ${e.key}`;
}
div {
  border: 1px solid red;
}
<div contenteditable="true" id="d"> </div>

<p id="log"></p>
0 голосов
/ 15 мая 2019

Попробуйте, у вас есть ошибка в вашем коде.

заменить onkeyup просто keyup

const input = document.querySelector('input');
const log = document.getElementById('log');

document.getElementById("d").addEventListener("keyup", logKey)

function logKey(e) {
   log.textContent += e.code;
}
#d {
  width:50%;
  color:red;
  background-color: yellow;
}
<div contenteditable="true" id="d"> </div>

<p id="log"></p>
...