javascript 全局事件绑定

查看:91
本文介绍了javascript 全局事件绑定的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

问 题

问题如下:


点击商品分类后,弹出菜单,同时绑定一个全局click事件用来隐藏菜单。

解决方案

js事件冒泡机制,希望能够帮到你

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
*{ 
    margin: 0;
    padding: 0;
}
#div{
    height: 400px;
    width: 400px;
    cursor: pointer;
    border: 3px solid #005588;
}
</style>
</head>
<body>
<div id="div"></div>
<script type="text/javascript">
var divDom = document.getElementById('div');
div.onclick = function(event){
    event = event || window.event;
    /*
    显示菜单动画
    */
    event.stopPropagation();//阻止事件冒泡
}
//点击层外,隐藏这个层。由于层内的事件停止了冒泡,所以不会触发下面这个事件
document.onclick = function(event){
    /*
    隐藏菜单动画
    */
}
</script>
</body>
</html>

这篇关于javascript 全局事件绑定的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆