如何更改以下代码，以便在单击网页上的任何位置时，“This is foo”行将消失，现在我必须单击“单击此处”使其消失。
<html>
<script type="text/javascript">
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
//-->
</script>
<body>
<a href="#" onclick="toggle_visibility('foo');">Click here</a>
<div id="foo">This is foo</div>
</body>
</html>
您需要将 click 事件绑定到body元素，以便在您单击页面上的任何位置时触发它。
尝试使用文档对象附加事件处理程序
document.onclick = function(){
var e = document.getElementById('foo');
e.style.display = ((e.style.display != 'none') ? 'none' : 'block');
};
HTML：
<body onclick="foo();">
<a href="#" onclick="toggle_visibility('foo');">Click here</a>
<div id="foo" style="display:none;" >This is foo</div>
</body>
JS：
var b = false;
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
b = true;
}
function foo() {
var e = document.getElementById('foo');
if(!b) e.style.display = 'none';
b=false;
}
这一点CSS：
body,html
{
width:100%;
height:100%;
}