Rudy Mj Rudy Mj - 1 month ago 7
HTML Question

Press enter and show another paragraph

How to make a javascript coding, when I press "ENTER" too the input

type="text"
, it will show another paragraph
p
.



var btn = document.getElementById("key");
btn.onkeypress = function(e){
if(e.keyCode === 13){
e.preventDefault();
}
}

<input type="text" id="key" placeholder="south">




Answer

Working fiddle.

It will be better to use a class hidden for example to hide/show your element :

var btn = document.getElementById("key");

btn.onkeypress = function(e){

  if(e.keyCode === 13){
    e.preventDefault();
    document.getElementById("my-paragraph").classList.remove("hidden");
  }
}
.hidden{
  display: none;
}
<input type="text" id="key" placeholder="south">
<p id="my-paragraph" class='hidden'>Hidden paragraph</p>


But you could also use inline-style display to show/hide elements, check basic example below.

Hope this helps.

var btn = document.getElementById("key");

btn.onkeypress = function(e){

  if(e.keyCode === 13){
    e.preventDefault();
    document.getElementById("my-paragraph").style.display='block';
  }
}
<input type="text" id="key" placeholder="south">
<p id="my-paragraph" style='display:none'>Hidden paragraph</p>