Show input only after button press-CodePudding

I want to hide the <input> from the home page, I only want the input to display when I press the button.

I was making a typing game. I added an input field for mobile users, but I only want it to show if the button is clicked.

CodePudding user response：

As I could see input fields are not hidden, so may want to hide them first. Example style="display:none". Then in your onclick add something like the following:

$("#buttonid").on("click", function(){
 $("#inputid").show();

CodePudding user response：

Assuming you have the ID of the button and the input, you can do the following:

const button = document.querySelector("#button")
const input = document.querySelector("#input");

button.addEventListener("click", () => input.style.display = "block");

Please note that the input should be with a display: none; CSS property first.