js点击页面其他地方如何隐藏div元素菜单
web页面常用的一个需求,写下拉菜单是我们往往不是用select_option,而是自定义一个元素列出选项来满足需求,当我们点击按钮出现菜单,
点击按钮或菜单以外页面空白地方隐藏该菜单,这里提供一种简单有效的方法仅供参考:
document.onclick = function(e) { $("div").hide(); } $('button').on("click", function(e) { if($("#div").css("display") == "none") { $("#div").show(); } else { $("#div").hide(); } e = e || event; stopFunc(e); }); $('#div').on("click", function(e) { e = e || event; stopFunc(e); }); function stopFunc(e) { e.stopPropagation ? e.stopPropagation() : e.cancelBubble = true; }
点击button出现div菜单,再次点击button隐藏菜单或点击div以外页面其他地方隐藏div菜单。