Question

js里document.onclick把本来要执行的方法屏蔽掉了

以下是我自己做的下拉列表的js，想实现在菜单显示后点击别的地方菜单隐藏的效果，找了一些方法，以下js或许能行，但是用document.onclick把本来的click给屏蔽掉了，不知道该怎么解决，求助各位，谢谢了！
/* 下拉菜单 显示菜单 */
var flag=false;//列表是否为已展开状态
var liId = "";//当前列表id
var count = 0;//当前ul的点击次数
var isOver = false;//点击事件是否已执行

function closeMenuWhenClickOther(){
if(document.getElementById(liId) != "" && count == 1)
{
if(document.getElementById(liId) != window.event.srcElement){
if(flag == true){
document.getElementById(liId).style.display = "none";//隐藏列表
flag=false;
}
}
}
}

function showUl(ulName)
{
var thisUl = document.getElementById(ulName).style.display;
if(thisUl == "none")//判断列表是否为已隐藏
{
document.getElementById(ulName).style.display = "block";//显示列表
liId = ulName;
flag = true;//设置状态为已展开
count = 1;
}
else
{
document.getElementById(ulName).style.display = "none";//隐藏列表
liId = "";
}
isOver = true;
}

/* 下拉菜单 选择选项 */
function changeTitle(ulName,thisO)
{
document.getElementById(ulName+"_title").innerHTML = thisO.innerHTML;
document.getElementById(ulName).style.display = "none";
}

document.onclick = closeMenuWhenClickOther;

Answer 1

首先要弄明白一样东西,就是DOM的事件响应顺序,通常是从里层往外冒泡的方式响应事件的,所以,当你点击你的菜单项显示菜单时同时触发了你绑定在最外层document上的onclick事件,这时此事件刚好是用来隐藏你的菜单的,结果就是当你点击菜单时显示不出来了.这样试试, 在showUl方法里面最后加上一句 return false; 用来阻止此点击事件向外层冒泡而触发最外层的document上的onclick事件,这样应该就OK了,不行可以再M我

追问

不行诶

Answer 2

亲，你这个是事件冒泡的原因，因为默认document是最顶层的对象，document里面的其他对象只要触发了click事件，都会冒泡的document上，导致document的click事件也会同时发生，解决办法，网上搜一下如何阻止事件冒泡就可以找到解决办法了