你好,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;

泛舟湖上清波郎朗
浏览 367回答 3
3回答

慕码人2483693

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

胡说叔叔

亲,你这个是事件冒泡的原因,因为默认document是最顶层的对象,document里面的其他对象只要触发了click事件,都会冒泡的document上,导致document的click事件也会同时发生,解决办法,网上搜一下如何阻止事件冒泡就可以找到解决办法了
打开App,查看更多内容
随时随地看视频慕课网APP