Skip to main content
1 de 3
Cris223511.dev
  • 9.3k
  • 4
  • 7
  • 31

El comportamiento predeterminado de la tecla ENTER es crear un nuevo elemento HTML, y lo podemos evitar con preventDefault().


Entonces, puedes agregar un listener y que al hacer keypress escuche el evento, y lo que hace es capturar el código de la tecla ENTER (que es el número 13) y le quitamos el evento que trae por defecto:

p.addEventListener("keypress", function (e) {
  if (e.keyCode === 13) {
    e.preventDefault();
  }
});

Ejemplo:

let span = document.getElementById("span");
let p = document.createElement('p');
document.body.appendChild(p);
p.textContent = "Text";
p.style.position = "absolute";
p.style.margin = "0";
p.contentEditable = "true";
function input() {
  let s = getComputedStyle(p);
  span.style.width = parseFloat(s.width) + "px";
  console.log("Divs salidos de la nada:" + document.getElementsByTagName("div").length);
}
p.addEventListener("focus", function (e) { e.target.style.outline = "none" });
p.addEventListener("input", input);

p.addEventListener("keypress", function (e) {
  if (e.keyCode === 13) {
    e.preventDefault();
  }
});
#span {
  background: green;
  width: 100px;
  height: 10px;
  position: absolute;
}
<span id="span"></span>

Cris223511.dev
  • 9.3k
  • 4
  • 7
  • 31