js 取消冒泡和阻止默认事件 封装取消冒泡的函数 封装阻止默认事件的函数

• 取消冒泡
  • event.stopPropagation(), w3c标准,IE9以下不兼容
  • IE独有 event.cancelBubble = true
  • 封装取消冒泡的函数 stopboubble(event)

div.onclick = function(e){
	//e.stopPropagation();
	//e.cancelBubble = true
}

封装取消冒泡的函数

function stopBubble(event){
	if(event.stopPropagation){
		event.stopPropagation();
	}else{
		event.cancelBubble = true;
	}
}

• 默认事件
  • 默认事件-- 表单提交，a标签跳转，右键菜单(contextmenu)等
  • return false; 以对象属性的方式注册的事件才生效 以onxxx绑定方式的
  • event.preventDefault(); w3c标准,IE9以下不兼容
  • event.returnValue = false; 兼容IE
  • 封装阻止默认事件的函数 cancelHandler(event)

// 阻止右键菜单打开默认事件
document.oncontextmenu = function(e){
	//return false
	//event.preventDefault()
	event.returnValue = false
}
// 阻止a标签跳转
a.onclick = function(e){
	return false
}

封装阻止默认事件的函数

function canceHandler(event){
	if(event.preventDefault){
		event.preventDefault()
	}else{
		event.returnValue = false;
	}
}