HTML // CSS // JavaScript：按钮或输入未显示在网络上

Question

我的表单使用基于用户文本输入的一些逻辑条件。 我为条件编写了JavaScript函数，并在用户在文本字段中键入内容后决定在用户​​单击按钮时执行此函数。 当我在Brackets.io的实时预览中运行代码时，按钮可见。 但是，当我在网络上打开.html文件时，按钮没有显示。

我尝试使用带有type =“ submit”的<input>使其成为按钮，但这也没有显示。

HTML：

<button id="funcCond">Proceed</button>

CSS：

button {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -300%);
          transform: translate(-50%, -300%);
  display: block;
  width: 70vw;
  opacity: 0;
  pointer-events: none;
  transition: all 0.5s cubic-bezier(0.4, 0.25, 0.8, 0.3);
}

Answer 1

尝试：

<button type="submit" id="funcCond">proceed</button>

要么：

<input type="button" value="proceed"/>

..并确保将不透明度值修改为1

Answer 2

尝试将（type）属性添加到html按钮<button type="button" id="funcCond">proceed</button>或者将输入元素与按钮类型<input type="button">