点击区域外隐藏该区域,event.stopPropagation()
- 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>