javascript - 相同编码的 div 不一样

Question

通过继续我的元素，我遇到了一个问题，即相同编码的 div 是模态(弹出)窗口，在单击按钮时触发。

在这里您可以发现问题 - “O mnie”(关于)窗口工作正常，而相同编码的“Kontakt”(联系人)窗口不工作 - http://antoszbk.pl/

运行良好(或不正常)的代码片段:

代码:

var aboutw = document.getElementById("myAbout");
var button1 = document.getElementById("aboutbtn");
var span = document.getElementsByClassName("close")[0];

var contactw = document.getElementById("myContact");
var button3 = document.getElementById("contactbtn");
var span2 = document.getElementsByClassName("close2")[0];


window.onload = function() {

  button1.onclick = function() {
    aboutw.style.display = "block";
    aboutw.style.animation = "slideInDown 0.5s";
  }

  span.onclick = function() {
    aboutw.style.animation = "slideOutUp 0.5s";
    setTimeout(function() {
      aboutw.style.display = "none";
    }, 500);
  }

  button3.onlick = function() {
    contactw.style.display = "block";
    contactw.style.animation = "slideInDown 0.5s";
  }

  span2.onclick = function() {
    contactw.style.animation = "slideOutUp 0.5s";
    setTimeout(function() {
      contactw.style.display = "none";
    }, 500);
  }

  window.onclick = function(event) {
    if (event.target == aboutw || event.target == contactw) {
      aboutw.style.animation = "slideOutUp 0.5s";
      contactw.style.animation = "slideOutUp 0.5s";
      setTimeout(function() {
        aboutw.style.display = "none";
        contactw.style.display = "none";
      }, 500);
    }
  }
}

<div id="mySidenav" class="Sidenav">
  <a href="#about" id="aboutbtn">O mnie</a>
  <a href="#achievements">Portfolio</a>
  <a href="#contact" id="contactbtn">Kontakt</a>
</div>

// WORKING WELL
<div id="myAbout" class="about">
  <div class="about-content">
    <span class="close">&times;</span>
    <p> Wkrótce tutaj coś będzie... </p>
  </div>
</div>

// NOT WORKING WELL
<div id="myContact" class="contact">
  <div class="contact-content">
    <span class="close2">&times;</span>
    <p> Wkrótce tutaj coś będzie... </p>
  </div>
</div>

Answer 1

只是一个简单的错字!

button3.onlick = function() {...

应阅读:

button3.onclick = function() {

(即:“onClick”而非“onLick”)