单击任何链接时，Javascript 关闭模态窗口

Question

我有 3 个超链接出现在模式框中。当我单击其中一个链接时，模式框将关闭。

链接示例:

    <a href="javascript:void(0)" class="cat">Link 1</a>
    <a href="javascript:void(0)" class="cat">Link 2</a>
    <a href="javascript:void(0)" class="cat">Link 3</a>

如果我指定了链接的索引，我已经成功地关闭了模式。

var links = document.getElementsByClassName("cat")[2]; 

调用一个函数，然后将模态显示为“无”:

links.onclick = function() {
    modal.style.display = "none";
}

这是一个Jfiddle example...

这只会关闭第 3 个链接，因为我正在传递 [2]，但我希望能够在单击任何链接时关闭模式。

感谢任何帮助。

干杯

Answer 1

您仅将 onclick 监听器分配给第三个链接。您可以简单地使用 for 循环为每个链接分配 onclick 监听器。

改变

var links = document.getElementsByClassName("cat")[2];

到

 var links = document.getElementsByClassName("cat");

并使用for循环作为

for(i=0; i<links.length;i++){
  links[i].onclick = function() {
    modal.style.display = "none";
  }
}

已更新 JSFiddle