javascript - img onClick 不起作用

Question

我遇到了这个问题 <img onClick="close()" src="img/close.png"> ，这是关闭函数

function close(n){
    document.getElementById('overlay').style.display = "none";
}

我不知道为什么，但是当我单击该图像时，没有任何反应，当我在控制台中尝试 close() 时，它起作用了。我什至尝试做 <a href="#" onClick="close()"><img src="img/close.png"></a>但什么也没发生。有谁知道问题出在哪里吗？我不知道问题出在哪里。

我尝试将其添加到 JSfiddle 但效果较差 http://jsfiddle.net/hHe2w/5/

Answer 1

close() 是全局 window 对象的 native 方法，因此在 HTML 本身中使用内联代码时，它将在某些浏览器中优先。

将函数名称更改为更有意义的名称，例如

function HideOverlay(){
    document.getElementById('overlay').style.display = "none";
}

当然，也更改调用，它会起作用。

Live test case .

更好的做法是仅使用 JavaScript 来定义点击事件:

window.onload = function() {
    document.getElementById("imgHideOverflow").onclick = function() {
        document.getElementById('overlay').style.display = "none";
    };
};

不要在 HTML 本身中乱用 JS。 Updated fiddle .