点击区域外隐藏该区域，event.stopPropagation()

时间：2016-01-11 23:57:28 阅读：482 评论：0 收藏：0 [点我收藏+]

Description: Prevents the event from bubbling up the DOM tree, preventing any parent handlers from being notified of the event.

点击区域外隐藏该区域Example:

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta content="charset=utf-8" />
 5 <style type="text/css">
 6 .box {
 7     width:100px; 
 8     height:100px; 
 9     background:blue;
10 }
11 </style>
12 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
13 <script type="text/javascript">
14     $(function() {
15         $(document).click(function() {
16             $(‘.box‘).hide();
17         })
18         $(‘.box‘).click(function(event) {
19             event.stopPropagation();
20         })
21     });
22 </script>
23 </head>
24 <body>
25 <div class="box">box</div>
26 </body>
27 </html>