阻止事件冒泡 阻止浏览器的默认行为

<!DOCTYPE html>      
<html lang="en">      
<head>      
    <meta charset="UTF-8">      
    <title>阻止事件冒泡 阻止浏览器的默认行为</title>    
    <style type="text/css">
    </style>     
</head>      
<body>
	<button id="btn1">按钮1</button>
	<input type="text" id="m-text">
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.js"></script>
	<script type="text/javascript">
		$(function() {
			function stopBubble(e) { 
				//如果提供了事件对象,则这是一个非IE浏览器 
				if (e && e.stopPropagation) {
					//因此它支持W3C的stopPropagation()方法 
					e.stopPropagation(); 		
				} else {
					//否则,我们需要使用IE的方式来取消事件冒泡 
					window.event.cancelBubble = true; 
				}
			} 			
			$('body').on('click', function() {
				console.log('body');
			});
			$('#btn1').on('click', function(e) {
				console.log('按钮1');
				stopBubble(e); //阻止冒泡
			});

			//阻止浏览器的默认行为 
			function stopDefault(e) { 
				//阻止默认浏览器动作(W3C) 
				if (e && e.preventDefault) {
					e.preventDefault(); 
				} else { //IE中阻止函数器默认动作的方式 
					window.event.returnValue = false; 
				}
				return false; 
			}			
			$('#m-text').on('keydown', function(e) {
  				console.log(String.fromCharCode(e.keyCode));
  				stopDefault(e);
			});
		});
	</script>
</body>      
</html> 

原文地址:https://www.cnblogs.com/xutongbao/p/9924906.html