Поле ввода исчезает, текст остается

Question

Пример того, что я хочу

Извините, нубизм.

• Я хочу, чтобы поле ввода исчезало при вводе. (Как и «3» в примере.)
• Я хочу, чтобы поле ввода возвращалось, если я хочу редактировать ввод.

Я посмотрел в Интернете о том, как сделать это и как go обойти это, но я не могу извлечь из этого ничего полезного.

Я пробовал что-то вроде этого (старый, нерелевантный код, это всего лишь пример того, что я пытался do):

function addButtonActions() {
    questionsButton.addEventListener("click", function () {
        var page = document.getElementById('page-questions');
        hideAllPages();

        page.style.display = 'block';
});

function hideAllPages() {
    var startPage = document.getElementById('page-start');
    var questionsPage = document.getElementById('page-questions');
    var scorePage = document.getElementById('page-score');

    startPage.style.display = 'none';   
    questionsPage.style.display = 'none';
    scorePage.style.display = 'none';
}

Но, похоже, это не работает для поля ввода. Я не использую <form></form>, потому что это всегда дает мне ошибки. Что-то вроде <form></form>, в любом случае, не помогает моему макету страницы.

Answer 1

Прежде всего: Пример использования FORM

Ваша проблема в JavaScript. Ваше призвание скрывается, затем за ним вызывается BLOCK, который его скрывает.

hideAllPages();
page.style.display = 'block';

Кроме того, что такое вопросы, кнопка? Это должна быть переменная объекта.