javascript - 为什么不显示这个弹出窗口？

Question

我对一个非常简单的 JavaScript 弹出脚本有疑问。

我有这个示例页面:http://www.onofri.org/example/example4/

在此页面的末尾有一个包含一些旗帜的框，其中包括由 #reportEng div 表示的英国国旗(在 engLink 链接内) )。

我想要的是，当用户单击此元素时，将显示一条弹出消息。

所以我向页面添加了这个简单的脚本:

<script>
    var test = document.getElementById('engLink');
    test.addEventListener('click', function() {
        alert('clicked');
    });
</script>

我已将脚本放在页面的正文部分中，而不是标题部分中，因为这只是一个测试页面，最终结果将放入我无权访问模板的 CMS 页面(因此我无法将脚本放在 head 部分)。

问题是它不起作用。如果我单击英文旗帜，页面将重新加载，并且不会显示弹出窗口。

你能帮我吗？

谢谢，

安德里亚

Answer 1

我采取了完全不同的方法。 addEventListener 非常酷，但我有点老了，并且默认了一些讨厌的习惯。这对我来说效果很好。

<script>
function myExample(){
    alert("BaZing!  It works!");
}
</script>

对于 HTML 部分...

<a href="" id="engLink"><div id="reportEng" onClick="myExample()"></div></a>

我还想指出，这个“修复”有点禁忌( see here )