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>

单击该虚拟键盘后，如何使按钮消失

1 个答案: