Как сделать так, чтобы кнопка на этой виртуальной клавиатуре исчезала после ее нажатия?

Question

Я создал виртуальную клавиатуру в html и css, и теперь я хочу написать код на JavaScript, который делает кнопку невидимой после нажатия на нее.Я пробовал этот код, но он не работал:

function myFunction() {
var x = document.getElementById("simple_button");
  if (x.style.display === "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}

Answer 1

Как пояснил в комментариях grooveplex, трудно дать вам ответ, не видя всей вашей разметки и CSS.Но я дам тебе пропуск, потому что ты здесь впервые.

Если вы хотите скрыть кнопку после нажатия, вы можете просто добавить прослушиватель события щелчка для всех ваших кнопок, а затем добавить класс для нажатой кнопки.Затем задайте этому классу любой стиль, который вы бы хотели, чтобы кнопка была нажата.Вы, вероятно, хотите использовать скрытую видимость, поскольку она будет поддерживать структуру вашей визуальной клавиатуры

    // get all buttons
    var documentButtons = document.getElementsByTagName('button');
    // add an event listener to all buttons
    for (var i = documentButtons.length - 1; i >= 0; i--) {
        documentButtons[i].addEventListener('click', removeButton);
    }
    // create remove button function (cross browser)
    function removeButton(e) {
        //  define variables
        var name, arr;
        // define class name
        name = "hidden";
        // define where to add the class name
        arr = e.target.className.split(" ");
        // add the class name
        if (arr.indexOf(name) == -1) {
            e.target.className += " " + name;
        }
    }

.hidden {
    visibility: hidden;
}

<button>Button 1</button>
<button>Button 2</button>
<button>Button 3</button>
<button>Button 4</button>
<button>Button 5</button>